カスタム リピーター ディレクティブを作成し、式をディレクティブ テンプレート内の ng-repeat に渡したいと考えています。
これの理由は、「フードの下に」他のディレクティブも含めているため、html でよりクリーンなインターフェイスを提供するためです。
http://jsfiddle.net/DeanIconWeb/Cg9RC/1/
ここに私のhtmlテンプレートがあります:
<tr custom-repeater="person in people">
<td>{{person.name}}</td>
<td>{{person.gender}}</td>
<td>{{person.age}}</td>
</tr>
これが私の指示です:
app.directive("customRepeater", function(){
return {
priority : 2000,
restrict: 'A',
replace : true,
transclude : true,
scope : {
ngRepeatExp : "@customRepeater"
},
template : "<tr ng-repeat='{{ngRepeatExp}}' ng-class-even=\"'even'\" ng-transclude></tr>"
}
});
これを機能させようとして、「テンプレートにはルート要素が 1 つ必要です」というエラーが表示され続けました。
私は最終的に次のことを行いましたが、それは私が本当に望んでいるものではありません。
<tr ng-repeat="person in people" custom-repeater>
<td>{{person.name}}</td>
<td>{{person.gender}}</td>
<td>{{person.age}}</td>
</tr>
指令
app.directive("customRepeater", function($compile){
return {
priority : 2000, //must be compiled before the ng-repeat (priority 1000)
restrict: 'A',
compile : function(tElem, tAttrs){
tElem.attr("ng-class-even", "'even'" );
}
}
});