javascript - 在 AngularJS 1.4.8 中观察元素高度的正确方法是什么？

Question

我意识到有很多帖子询问类似甚至相同的事情，但在你混合重复按钮之前，请注意我已经尝试了每一个解决方案，但它们都没有在我的目标 AngularJS 中工作版本(1.4.8)。考虑到这一点:

HTML:

<div ng-app="app" ng-controller="app">
  <textarea size-watch>{{ height }}</textarea>
</div>

JavaScript:

angular.module("app", [])
.controller("app", function() {
})
.directive("sizeWatch", function() {
    return {
    restrict: "A",
    link: function(scope, elem) {
            scope.$watch(function() { return elem[0].offsetHeight; }, function(newHeight, oldHeight) {
        scope.height = newHeight;
      }, true);
    }
  }
});

Fiddle .

这就是我想要做的:我想创建一个指令来监视元素的高度并在其发生变化时更新范围上的属性。我可以获得最初显示的值，因此我知道指令和 Controller /作用域之间的链接正在工作。但是，当调整文本区域大小(通过拖动右下角)时，我无法获取要更新的值。我在第二个 watch 函数中调用了 debugger;，并验证它只被调用一次。

当您找到可行的解决方案时，请随时更新链接的 fiddle 。

Answer 1

我选择用于测试目的的元素是不幸的。显然，textarea 不会像其他元素(特别是 divs)那样引发调整大小事件。这是 working fiddle我想要实现的目标。