Angular 1.5 では、複数のトランスクルージョンが可能です。
特に、動的な数のアイテムをディレクティブにトランスクルージョンし、後で (リンク/コンパイルなどで) それらのトランスクルードの名前と場所を宣言できると便利です。
さらに説明すると、次のような機能が必要です。
//Example usage of directive
<multi-slot-transclude-example>
<transclude1>TEST1</div>
<transclude2>TEST2</div>
<transclude3>TEST3</div>
<transclude4>TEST4</div>
.... dynamic number of items ...
</multi-slot-transclude-example>
//Example of directive that dynamically transcludes multiple items
angular.module("multiSlotTranscludeExample", [])
.directive("directiveName", function(){
return {
restrict: 'E',
transclude: {
't1': '?transclude1',
't2': '?transclude2',
//I'd like this list to be able to be defined non-statically (e.g. in link)
},
template: '<div ng-repeat="n in transcludedElementList">'
+ '<div ng-transclude="t{{n}"></div>'
+ '</div>'
};
})
マルチトランスクルードを実装するディレクティブ宣言では、宣言時にトランスクルードされるアイテムの数について事前に知っておく必要があることに注意してください。
リンクで (または回避策を使用して) このようなことを行う方法はありますか?