javascript - $ watch element.scrollHeight未触发

我在div标记内（在td标记内）有一个tr。此div具有一个自定义指令，该指令需要$watch元素的scrollHeight：

<tr ng-show="showRow">
    <td>
      <div my-custom-directive>My very long text</div>
    </td>
</tr>

对于指令：

appDrct.directive('myCustomDirective', [function() {

   return {
       restrict : 'A',
       compile : function(elem, attr, linker) {


          return function(scope, element, attributes) {
             scope.$watch(element[0].scrollHeight, function(){
                console.log('triggered');
             })
          }
       }
    }
}])

showRow变量通过ng-click更改。

问题是，即使$watch由于scrollHeight而发生更改（ng-show等于scrollHeight时ng-show等于0），也永远不会触发false（第一次除外）。 。

我最初以为是因为我必须使用$scope.$apply，但我不知道将其放置在哪里...

最佳答案

您无法观看直接对象引用（这是您要尝试的操作）。您可以监视当前作用域的属性（通过提供属性名称作为字符串），也可以监视函数，该函数将返回新值。

将手表更改为：

scope.$watch(function(){ return element[0].scrollHeight }, function(){
    console.log('triggered');
});

另一方面，正如评论者指出的那样，您应该在DOM中使用破折号而不是驼峰式大小写来引用指令。

关于javascript - $ watch element.scrollHeight未触发，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/30833215/