大佬教程收集整理的这篇文章主要介绍了angularjs – 使用nginclude时避免使用额外的DOM节点,大佬教程大佬觉得挺不错的,现在分享给大家,也给大家做个参考。
这是实际的代码:
<div id="wrapper"> <header ng-controller="HeaderController" data-ng-class="headerType" data-ng-include="'/templates/base/header.html'"> </header> <section ng-controller="SubheaderController" data-ng-class="subheaderClass" ng-repeat="subheader in subheaders" data-ng-include="'/templates/base/subheader.html'"> </section> <div class="main" data-ng-class="mainClass" data-ng-view> </div> </div>
我需要< section>成为一个重复元素,但有自己的逻辑和不同的内容。内容和重复次数都取决于业务逻辑。如您所见,将ng-controller和ng-repeat放在< section>上。元素不起作用。然而,插入一个新的DOM节点会是什么,这正是我想要避免的。
我错过了什么?这是最佳做法还是有更好的方法?
编辑:只是为了澄清评论中的问题,我试图生成的最终HTML将是:
<div id="wrapper"> <header>...</header> <section class="submenuX"> some content from controller A and template B (e.g. <ul>...</ul>) </section> <section class="submenuY"> different content from same controller A and template B (e.g. <div>...</div>) </section> <section class="submenuZ"> ... (number of repetitions is defined in controller A e.g. through some servicE) </section> <div>...</div> </div>
我想使用相同模板B(subheader.html)的原因是代码清洁度。我设想subheader.html有一些ng-switch来返回动态内容。
相反,在an answer to a similar question,我们找到了另一种选择:它允许你写:
<div ng-include src="dynamicTemplatePath" include-replace></div>
自定义指令:
app.directive('includereplace',function () { return { require: 'ngInclude',reStrict: 'A',/* optional */ link: function (scope,el,attrs) { el.replaceWith(el.children()); } }; });
(cut’n’paste来自其他答案)
以上是大佬教程为你收集整理的angularjs – 使用nginclude时避免使用额外的DOM节点全部内容,希望文章能够帮你解决angularjs – 使用nginclude时避免使用额外的DOM节点所遇到的程序开发问题。
如果觉得大佬教程网站内容还不错,欢迎将大佬教程推荐给程序员好友。
本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。