Question

我有以下内容：

app.directive("myDirective", function($compile) {
    return {
        replace: true,
        scope: {},
        template: "<div></div>",
        link: function(scope, elem) {

            scope.list  = [1, 2, 3, 4, 5];
            $compile("<div my-list></div>")(scope, function(clone) {
                // Why the ng-repeat isn't compiled yet?
                alert(clone[0].outerHTML);
                elem.html(clone);
            });
        }
    };
});

app.directive("myList", function() {
    return {
        replace: true,
        template: "<ul><li ng-repeat=\"item in list\">{{item}}</li></ul>"
    };
});

<div my-directive></div>

有人可以告诉我为什么我的<li>'s不在alert？

http://jsfiddle.net/AlexFigueiredoo/jNceZ/

Answer 1

<强> Here is your updated Fiddle

它正在使用$ timeout指令（http://docs.angularjs.org/api/ng.$timeout）并且'0'冷却时间。听起来有点棘手但是......

所以，在你的控制器中注入 $ timeout ，然后在你的回调中注入：

$timeout(function () {
    alert(clone[0].outerHTML);
}, 0);

Answer 2

好的，所以我要在@ dawuut的回答中添加一些内容。

alert将$timeout包裹在'0'的冷却时间是有效的，因为在角度$digest周期结束前不会触发超时。

所以，当你第一次在父指令中调用alert时，孩子们还没有被编译（他们都有自己的范围）。

Answer 3

我猜你编译<div my-list></div>的任务是在子逻辑中生成li的同时计算的。

这可以解释为什么alert在li ng-repeater完成$timeout之前发生。

因此，{{1}}对于线性化两个任务非常有用。

原因解释为：Why timeout(0) is sometimes necessary?

Ng重复优先级

3 个答案: