Recursive Ng-include causing Error: $rootScope:infdig Infinite $digest Loop

Recursive Ng-include causing Error: $rootScope:infdig Infinite $digest Loop

我有一个递归的 Ng-include 导致错误:$rootScope:infdig Infinite $digest Loop

在我的ctrl中:

function getTemplate(elementType) {
        console.log(elementType + '_formElement.html');
        return elementType + '_formElement.html';
    };

在我看来:

<div ng-repeat="element in elementList track by $index" ng-init="templateID=vm.getTemplate(element.elementType)">
    <ng-include src="templateID"></ng-include>
</div>

结果: 达到 10 次 $digest() 迭代。中止!

Watchers fired in the last 5 iterations: [[{"msg":"fn: function (c,e,f,g){f=d&&g?g[0]:a(c,e,f,g);return b(f,c,e)}","newVal":3},{"msg":"fn: function (a){return d(a)}","newVal":""},{"msg":"templateID","newVal":"ROW_formElement.html"}],[{"msg":"fn: function (c,e,f,g){f=d&&g?g[0]:a(c,e,f,g);return b(f,c,e)}","newVal":3},{"msg":"fn: function (a){return d(a)}","newVal":""},{"msg":"templateID","newVal":"ROW_formElement.html"}],[{"msg":"fn: function (c,e,f,g){f=d&&g?g[0]:a(c,e,f,g);return b(f,c,e)}","newVal":3},{"msg":"fn: function (a){return d(a)}","newVal":""},{"msg":"templateID","newVal":"ROW_formElement.html"}],[{"msg":"fn: function (c,e,f,g){f=d&&g?g[0]:a(c,e,f,g);return b(f,c,e)}","newVal":3},{"msg":"fn: function (a){return d(a)}","newVal":""},{"msg":"templateID","newVal":"FIELD_formElement.html"}],[{"msg":"templateID","newVal":"TEXT_field.html"},{"msg":"fn: function (a){return d(a)}","newVal":""}]]

Console.log:

  ROW_formElement.html
7 ROW_formElement.html
  FIELD_formElement.html

我知道我可以像下面这样增加 TTL,但是还有其他解决方案吗?

angular.module('myApp',[]) .config(function($rootScopeProvider) { $rootScopeProvider.digestTtl(number); //some number bigger then 10 })

经过大量搜索,我认为我的代码没有错误。

如回答here and shown in this plunkr 这就是angular 的工作方式。
除了设置比 10 更高的摘要 TTL 数字外似乎没有其他解决方案。

angular.module('myApp',[]) .config(function($rootScopeProvider) { $rootScopeProvider.digestTtl(number); //some number bigger then 10 })

我遇到了同样的问题,我听从了关于这个 link 的建议并且成功了!:

Building Nested Recursive Directives in Angular