Question

当我用户点击桌面上的特定行时，我的网站部分会显示：

<div ng-show="showDetails">
   <details item=selectedItem></details>
</div>

该指令包含一个必须用此初始化的实体化表单，以便正确显示：

$('select').material_select();

我想要做的是在ngShow DOM操作完成时调用一个函数，调用$('select').material_select();以使用正确的实体设置替换选择输入字段。

知道如何观看DOM更改吗？

Answer 1

这是一种非常非常hacky的方式来做你想要的。假设您有一个显示表单的ngClick函数，您可以在其中设置showDetails表单，您可以使用$ timeout函数，该函数在角度完成脏检查DOM之后调用。脏的DOM检查只不过是在摘要周期结束时检查范围值。 Angular在内部检查其先前值的所有范围值，并相应地更新模型。

$scope.clickHandler = function() {
  $scope.showDetails = true;
  $timeout(function(){
    // ng if has just concluded
  });
}

Answer 2

您也可以合并$timeout服务和元素的ng-init指令：

<div ng-init="init()" ng-if="showDetails">
  <details item=selectedItem>selectedItem</details>
</div>

请注意，我已将ng-show替换为＆＃39; ng-if＆＃39;，每次重新呈现元素时都会触发

plunker：http://plnkr.co/edit/357zd0Lc3i29YUxcVeM7?p=preview

如何检测ngShow DOM更改已完成？

2 个答案: