2014-08-28 115 views
0

之外我有下面的代碼,這是一個ngRepeat內運作良好什麼是設置ngRepeat迭代ngRepeat

<div ng-repeat="item in items"> 
    <ng-include src="itemView.html"> 
    <!-- ngincluded view "itemView.html" --> 
    {{item.title}} 
</div> 

現在我想在我的應用程序的其他地方使用itemView.html,不是最好的方法

這樣做的最好方法是什麼?

我意識到,一個選項將創建一個新的範圍數組變量var singleItem=[myItem],並把<div ng-repeat="item in singleItem">周圍,但有沒有更多的角度?

回答

1

你可以使用ng-init。

主要的html:

<!-- use it with ng-repeat --> 
<div ng-repeat="item in items"> 
    <div ng-include src="template.url" onload='myFunction()'></div> 
</div> 

<!-- using anywhere else in your code ng-init="item=item[index]" --> 
<div ng-init="item=items[1]" ng-include src="template.url" onload='myFunction()'></div> 

<!-- template --> 
<script type="text/ng-template" id="template1.html"> 
    {{item.title}} 
</script> 
+0

爲我工作 – pinoyyid 2014-08-28 07:25:46

1

由於您的項目詳細信息是itemView.html模板的一部分,因此它是獨立的。所以它可以在您的應用程序的任何地方使用,沒有任何問題 爲了讓你可重複使用的模板獨立的變量名的項目中,你可以在這樣的指令,把它包裝:

module.directive('reusableItem', function() { 
return { 
    restrict: 'E', 
    scope: { 
    myItem: '=item' 
    }, 
    templateUrl: 'itemView.html' 
}; 

});

用itemView.html中的myItem替換所有項引用。

將像這樣使用: <可重複使用的項目我的項目=「項」 > < /可重複使用的項目> 爲你的情況。

第二個使用此相同的指令可能看起來像: <可重複使用的項目我的項目=「itemXyz」 > < /可重複使用的項目>

什麼,你還要做的是緩存你的模板,如果它正在多個地方使用。要做到這一點,你可以使用$templateCache

+0

你已經錯過了問題的要點。 itemView模板包含對「item」的引用。除了將其包裝在ngRepeat中,我該如何設置項目? – pinoyyid 2014-08-28 06:36:31

+0

將可重複使用的模板包裹在指令中並傳遞想要傳遞的數據。 – 2014-08-28 06:40:39