6

我正在尝试使用 ng-include 递归地渲染分层树。这是一个小提琴

问题在于我的链接函数在渲染完成之前被调用以尝试在空列表上初始化菜单插件。

link: function (scope, element, attrs) {

    var $menus = element.find("ul");

    //Prints empty element        
    console.log($menus.html());

    //No real $menus to initialize 
    //$menus.menuAim({ });

}

我知道onload在 ng-include 上有，但我不想诉诸一些丑陋的技巧，比如在每次加载时增加一个计数器并与元素计数进行比较，因为由于层次结构，计算计数变得很棘手。

有什么更简洁的方法可以知道 ng-include 何时完成完整的递归渲染并且所有元素都在页面上？

我尝试使用 postLink 而不是链接，但指令仍然打印一个空<ul>：

link: {
     pre: angular.noop,
     post: function(scope, element, attrs){
          //no difference
     }
}
4

1 回答 1

3

您可以将 $timeout 用于上述目的。如果没有提供第二个参数即“delay”，则默认行为是在dom渲染完成后执行该函数。所以代码会是这样的：

    $timeout(function () {
        //Prints empty element        
        console.log($menu.html());
    });

并且 $timeout 需要作为指令中的依赖项注入

    .directive('menuHierarchy', function ($timeout) {
        //directive code
    });

在您的示例中，它会根据需要正确打印所有“li”节点。

于 2014-03-06T04:19:43.290 回答