带有ng-include的ng-repeat无法正常工作 [英] ng-repeat with ng-include not working
问题描述
我正在尝试使用包含ng-include
的ng-repeat
.问题是ng-repeat中的第一个元素只是ng-include
模板,没有填充ng-repeat
中的数据.有没有办法我可以通过某种方式绑定ng-include
的模板,所以它可以工作在第一个ng-repeat
上?
I am trying to use an ng-repeat
that includes an ng-include
. The problem is that the first element in the ng-repeat is just the ng-include
template with none of the data from the ng-repeat
filled in. Is there a way I can somehow bind the template from the ng-include
so it works on the first ng-repeat
?
<div ng-repeat="item in items">
<div ng-include src="'views/template.html'"></div>
</div>
例如,如果我的ng-repeat
包含10个项目,则呈现的第一个项目将只是空模板.项目2-10将按原样呈现.我在做什么错了?
For example, if my ng-repeat
contains 10 items, then the first item that is rendered will just be the empty template. Items 2-10 WILL be rendered as they should be. What am I doing wrong?
推荐答案
首先请确保项目的第一个索引中包含的数据实际上具有所需的数据.
First make sure that the data that is contained in the first index of items actually has the data that you want.
一种可能的解决方案是不显示ng-repeat的第一个索引:
One possible solution to your problem would be to simply not show the first index of the ng-repeat:
<div ng-repeat="item in items" ng-show="!$first">
<div ng-include src="'views/template.html'"></div>
</div>
这实际上可能无法解决问题的根源,但仍可能使您的应用程序更像您期望的那样工作.
This may not actually tackle the root of your problem, but it may still get your application working a bit more like what you expect.
另一种可能的解决方案:
Another possible solution:
<div ng-repeat="item in items" ng-include="'views/template.html'"></div>
在此处查看示例:
http://plnkr.co/edit/Yvd73HiFS8dXvpvpEeFu?p=preview
还有一个可能的修复程序,用于很好的测量:
One more possible fix just for good measure:
使用组件:
html:
<div ng-repeat="item in items">
<my-include></my-include>
</div>
js:
angular.module("app").directive("myInclude", function() {
return {
restrict: "E",
templateUrl: "/views/template.html"
}
})
这篇关于带有ng-include的ng-repeat无法正常工作的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!