9

ng-repeatを含むを使用しようとしていますng-include。問題は、ng-repeat の最初の要素がng-include、入力されたデータがまったく含まれていない単なるテンプレートであることです。最初の要素で機能するようng-repeatに、テンプレートを何らかの方法でバインドできる方法はありますか?ng-includeng-repeat

<div ng-repeat="item in items">
    <div ng-include src="'views/template.html'"></div>
</div>

たとえば、myng-repeatに 10 個のアイテムが含まれている場合、レンダリングされる最初のアイテムは空のテンプレートになります。アイテム 2 ～ 10 は、本来あるべき姿でレンダリングされます。私は何を間違っていますか？

4

3 に答える 3

26

最初に、アイテムの最初のインデックスに含まれるデータに必要なデータが実際に含まれていることを確認します。

問題の解決策の 1 つは、単に ng-repeat の最初のインデックスを表示しないことです。

<div ng-repeat="item in items" ng-show="!$first">
   <div ng-include src="'views/template.html'"></div>
</div>

これは実際には問題の根本に対処するものではないかもしれませんが、アプリケーションが期待どおりに動作するようになる可能性があります。

別の可能な解決策：

<div ng-repeat="item in items" ng-include="'views/template.html'"></div>

ここで例を参照してください：

http://plnkr.co/edit/Yvd73HiFS8dXvpvpEeFu?p=preview

適切な測定のために、もう1つの可能な修正：

コンポーネントを使用する:

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"
}
})
于 2014-01-05T06:26:01.147 に答える