Question

我花了一个多小时试图做一些相当简单的事情：
创建一个角度指令，可以获取和设置当前元素的高度。相同的指令应该可以访问窗口（浏览器）以获得其高度。

到目前为止，在测试时，我已经达到了这个（丑陋）的观点：

myApp.directive("mainposter", function() {
  return {
    restrict: "E",
    replace: false, //default is false, setting this to true has known bugs
    //scope: {},
    template: '<section class="mainposter">dummy text inside</section>',
    link: function(scope, elem/*, attrs*/) {
        /*elem.ready(function() {
            console.log("the current height is: " + this.prop("tagName"))
        })*/
        console.log("the current tagname is: " + elem.prop("tagName"))
        console.log("the current height is: " + elem.height())
    }
  }
})

目前我感兴趣的是只在页面加载时执行一次，而不是像这个解决方案一样：When to get the width of an Angular directive?

沮丧的Angular新手需要你的帮助。谢谢

修改这个问题需要稍微不同的答案，因为in this forum他们提到replace: true已知错误问题

Answer 1

您可以使用elem[0].clientHeight或elem[0].offsetHeight来获取元素的高度。

link: function(scope, elem/*, attrs*/) {
        /*elem.ready(function() {
            console.log("the current height is: " + this.prop("tagName"))
        })*/
        console.log("the current tagname is: " + elem.prop("tagName"))
        console.log("the current height is: " + elem[0].clientHeight);
    }

Answer 2

您可以为$(elem).height()

使用jQuery

Answer 3

确实 jQuery 对此任务很有用。

设置为replace: false的元素的高度为：$(elem[0].firstChild).height()
_{也.outerHeight()或.innerHeight()，具体取决于您想要计算的内容}

你得到这样的窗户高度：
$(window).height()

如何获得角度指令的高度？

3 个答案: