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

Question

当我在 table:

上点击特定行时，我的网站会显示一部分

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

该指令包含一个实体化表单，必须用它初始化才能正确显示：

$('select').material_select();

我想做的是在 ngShow DOM 操作完成时调用一个函数，该函数将调用 $('select').material_select(); 将 select 输入字段替换为正确的具体化设置。

知道如何观看 DOM 变化吗？

Answer 1

这是一种非常非常 hacky 的方式来做你想做的事。假设您有一个显示表单的 ngClick 函数，您在其中设置了 showDetails 表单，您可以使用在 angular 完成脏检查 DOM 后调用的 $timeout 函数。 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 替换为 'ng-if'，每次重新渲染元素时都会触发

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

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

How can I detect that ngShow DOM changes are done?

javascript

materialize

angularjs

angular-directive