Question

我正在使用ng-repeat和自定义指令。标记是

<div foo ng-repeat="item in [{url:'var',text:'one'},{url:'char',text:'two'}]">
 <img src="{{item.url}}" />
 <p>{{item.text}}</p>
</div>

指令定义是

app.directive('foo',function(){
  return{
    restrict : 'A',
    transclude:'element',
    scope:{},
    link:function(scope,element,attrs,ctrl,transclude){
      transclude(function(clone,transScope){
        console.log(clone.html());
      });
    }
  }
});

考虑到ng-repeat的优先级为1000，自定义指令的默认优先级为0，ng-repeat的编译和链接将在foo的链接之前运行。这意味着ng-repeat会添加新的DOM元素，而foo的链接应该可以访问这些元素。

当我执行console.log(clone.html())时，控制台会显示

<img src="{{img.image}}">
<p class="ng-binding">{{img.text}}</p>

为什么即使在编译和链接阶段完成ng-repeat之后，当我获得DOM元素的克隆时，也不会评估表达式。我错过了什么？

修改

刚才意识到它并非特定于ng-repeat

如果我们使用以下标记

，行为是相同的

<div foo>
 <img src="{{item.url}}" />
 <p>{{item.text}}</p>
</div>

考虑到父控制器范围中定义的item，在尝试在transclude函数中获取DOM时，仍然不会计算表达式。指令定义与上面提到的相同。

console.log(clone.html())行仍显示

<img src="{{img.image}}">
<p class="ng-binding">{{img.text}}</p>

任何帮助都会非常感激。

表达不在ng-repeat中评估

0 个答案: