在ng-repeat内动态加载模板 [英] Dynamically load template inside ng-repeat

查看:86
本文介绍了在ng-repeat内动态加载模板的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我试图在 ng-repeat 内动态加载模板:

 < UL> 
< li ng-repeat =实体中的道具>
< div ng-include src =prop.template>< / div>
< / li>
< / ul>

prop.template 等于模板,例如的partials /形式/ text.html 。上面的代码会产生以下错误:
$ b

 错误:达到了10次$ digest()迭代。中止! 
Watchers在最近5次迭代中触发:[[prop.template; newVal:\partials / form / text.html\; oldVal:undefined,prop.template; newVal:\ partials / form / text.html\; oldVal:undefined....(等等)

如何从 prop.template 获取模板的URL,并将该文件中的HTML插入到 ng-repeat

解决方案


http://docs.angularjs.org/api/ng 。$ rootScope.Scope#$ digest



处理当前作用域及其子项的所有观察者。因为观察者的监听者可以改变模型,所以$ digest()不断调用观察者,直到没有更多的监听者开火。这意味着有可能陷入无限循环。如果迭代次数超过10次,此函数将抛出'Maximum iteration limit exceeded'。

问题不在于此处的代码,它应该是完美的工作。请参阅此处的工作示例: http://jsfiddle.net/fmjf8/2/



问题是您的 ngRepeat ing数组中的元素数量可能太多,或者您的数组模板或模板包括做太多东西,提高角度的无限循环保护。我投了第二个$ / b $ b $

I am trying to dynamically load a template within an ng-repeat:

<ul>
    <li ng-repeat="prop in entity" >
        <div ng-include src="prop.template"></div>
    </li>
</ul>

prop.template equals the URL of the template, e.g. 'partials/form/text.html'. The above code produces the following error:

Error: 10 $digest() iterations reached. Aborting!
Watchers fired in the last 5 iterations: [["prop.template; newVal: \"partials/form/text.html\"; oldVal: undefined","prop.template; newVal: \"partials/form/text.html\"; oldVal: undefined" .... (and so on)

How do I get the URL of the template from prop.template and insert the HTML from that file into the DOM within ng-repeat?

解决方案

http://docs.angularjs.org/api/ng.$rootScope.Scope#$digest

Process all of the watchers of the current scope and its children. Because a watcher's listener can change the model, the $digest() keeps calling the watchers until no more listeners are firing. This means that it is possible to get into an infinite loop. This function will throw 'Maximum iteration limit exceeded.' if the number of iterations exceeds 10.

The problem is not about the code here, it should be working perfectly. See the working example here: http://jsfiddle.net/fmjf8/2/

The problem is either you may have too many elements in your ngRepeating array OR the template your array, or the template you are including is doing too many stuff, raising angular's infinite loop protection. I vote for the second

这篇关于在ng-repeat内动态加载模板的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆