ng-repeat范围不适用于其中的指令

Question

我有一个由ng-repeat重复的指令。

<div ng-repeat="p in people">
  <p>{{p.name.first}}</p>
  <slider-box
    title-text="{{p.name.first}}"
    body-text="Some body text"
    img-src="{{p.photo}}"
    more-link="#"></slider-box>   
  </div>
</div>

如果我在指令前添加<p>{{p.name.first}}</p>，则p会显示名字，但slider-box似乎无法访问p，因此由于没有给出任何数据，因此显示空白。

它可能不是一个异步问题，因为正在创建框，因此angular知道 某些内容到ng-repeat，并且<p>正在填充英寸

我在这里做了一个an example site，它显示了一个带有伪数据（只是字符串）的指令的例子，然后重复的那些就在那之下。

一个非常类似的问题被问到here但是没有发布任何代码示例，并且似乎已经死了。

Answer 1

您应该直接在指令声明中将属性传递到范围。

在您的指令声明中，不仅仅是scope: {}，而是scope:{ imgSrc:"@" }。它将直接在指令的隔离范围内传递属性的值。

请查看this short tutorial以获得更好的解释。