Question

我试图使用angular.treeview来显示树状结构，它运行得很好。但是，当我使用$ templateCache使其更易于维护时，它会导致无限循环。看起来使用字符串来存储模板会删除递归调用中的最外层循环，这些循环不会发生在从$ templateCache检索的模板中。在http://plnkr.co/edit/khQ7BMPRYedK6B1PVlDY?p=preview的示例中注释掉第二行（angular.treeview.js中的第88行）后，您将看到问题。

$log.log('cache:' + templateCache.get('treeNode.html'));
//template = templateCache.get('treeNode.html
$log.log('string:' + template);
                    //Rendering template.
                    element.html('').append( $compile( template )( scope ) );

如果我能获得$ templateCache的另一个问题是如何在编译之前替换模板中的变量？我想在模板中替换像treeModel和nodeChildren这样的变量，以使代码更加灵活。

Answer 1

通过命名控制器的$ scope变量（与递归调用相同）来实现它。换句话说，将$ scope.roleList更改为$ scope.node.children解决了无限循环问题。

//template refrence node.children
<li data-ng-repeat="node in node.children">

//assign tree nodes to $scope.node.children
$scope.node = {};
$scope.node.children = this.roleList1;

由于我已经转向使用controllerAs语法，我在http://plnkr.co/edit/Ua63IlaAqsRtgiGfbMaq?p=preview创建了一个带有修复的示例，以及使用$ scope和controllerAs变量的混合。修复本质上利用引用$ scope变量的副作用而不用 $ scope。进行限定，因此您可以使用相同的名称来引用$ scope变量以及递归内的局部变量环。

如何用$ templateCache做递归指令？

1 个答案: