编译后操作模板

Question

我有一个使用 ng-repeat 的简单模板：

template.html

<div id='tmpl'>
  <ul>
    <li ng-repeat="item in items">{{ item.desc }}</li> 
 </ul>
</div>

在我的指令中，我正在使用自定义范围编译该模板。然后将该模板添加到页面：

var element = $('#my-div');
var compiledTemplate = $compile(scope.template)(customScope);
element.before(compiledTemplate);
$('#tmpl').show();

这很好用，但问题是在调用 show() 后，我试图访问模板 innerHeight()，但那时模板内的 ng-repeat 尚未执行，我' m 在渲染元素之前获取值。

   $('#tmpl').innerHeight(); // returns value before ng-repeat is finished

那么，在 ng-repeat 完成处理元素之后，是否有一种安全的方法来对编译后的元素进行 DOM 操作？

Answer 1

您可以创建一个指令并在 post link 阶段获取 'innerHeight'。 ng-repeat 应该已经被执行并且正确的高度应该可用。

或者，您可以在模板完全呈现后使用 $timeout 和 运行 函数。