代码的目标是:
- 获取我的部分的高度
- 设置对象的高度
当前的 .js 代码是:
app.directive('safety', function() {
return {
restrict: 'A',
link: function(scope, element) {
var section = element[0].offsetHeight;
var padding = 60;
var heading = 49;
var button = 74;
var margin = padding + heading + button;
var newHeight = section - margin;
console.log('Section: ' + section);
console.log('New height: ' + newHeight);
}
};
});
我的 HTML 是:
<section class="section container-fluid safety-container" safety>
<h1 class="page-header">Procedures</h1>
<div class="row">
<div class="impact-doc-link col-md-12">
<a class="btn btn-safety btn-block" href="doc/procedures.pdf" role="button">Procedures</a>
</div>
<div class="impact-pdf-container col-md-12">
<object data="doc/procedures.pdf" type="application/pdf" width="100%" height="100%">
alt : <a href="doc/procedures.pdf">doc/procedures.pdf</a>
</object>
</div>
</div>
</section>
如何从“safety”指令中将“.impact-pdf-container”的高度设置为 newHeightVariable?我对 Angular js 很陌生。我要制定新指令吗?或者我可以简单地附加指令来合并此功能。
另一件事是,如果我不使用变量“padding”和“heading”,我如何从指令中获取其他元素高度?
最佳答案
您可以在指令内使用 DOM 方法。由于您使用的是 jQuery,因此更加简单:
app.directive('safety', function() {
return {
restrict: 'A',
link: function(scope, element) {
var section = element[0].offsetHeight;
var padding = 60;
var heading = 49;
var button = 74;
var margin = padding + heading + button;
var newHeight = section - margin;
element.find('.impact-pdf-container').height(newHeight);
}
};
});
以及关于如何读取元素的填充/边距。使用 jQuery 也很容易,所以你可以使用 css方法:
var padding = element.css('padding-left');
关于javascript - 如何从 AngularJS 指令中获取和设置元素高度,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/32759459/