为每个ng-repeat指令渲染唯一的ng-transclude模板

时间:2016-06-14 22:08:55

标签: javascript angularjs

是否可以为指令中的每个元素呈现唯一模板?我想展示我在说什么。例如

<div example-backgrounds images="['xyz.jpg','xyz2.jpg',	'xyz3.jpg','xyz4.jpg'	]"	><!-- directive then ng-repeat on each .jpg file -->
	<div><h1>Title</h1></div>		  <!-- transclude for xyz.jpg -->
    <div><button>Title2</button></div>  <!-- transclude for xyz2.jpg -->
  	<div><h2>Title3</h2></div>   <!-- transclude for xyz3.jpg -->
  	<div><h2>Hello <button>Title4</button></h2></div>   <!-- transclude for xyz4.jpg -->
</div>

有4个.jpg文件,然后我想为其他转换的每个元素呈现。 谢谢你的帮助。

1 个答案:

答案 0 :(得分:-1)

好的,我解决了自己的问题。有我的解决方案。好吗?有人有更好的代码吗?有我的。

&#13;
&#13;
    function link(scope, element, attr,ctrl,transclude) {
       var index = 0;
      transclude(function(clone){
        clone.each(function(v,k){
         
          if(this.nodeType === 3)
            return;
          var currentClone = this;
          $timeout(function(){
            $(element.find(".magic-bind")[index]).append(k);
            index++;
          })
        })
      })
    }
&#13;
&#13;
&#13;

示例背景有链接功能。然后我们有正确的输出。

相关问题