Question

AngularJS支持带有-start和-end后缀的多元素指令。官方文档仅提及ng-repeat-start和ng-repeat-end。其他内置指令是否支持此功能？

例如，这很好用：

<tbody>
  <tr ng-controller="myController">
    <td>{{firstName}}</td>
    <td>{{lastName}}</td>
  </tr>
</tbody>

{{firstName}}和{{lastName}}都会被替换为适当的值。

但这只能部分起作用：

<tbody>
  <tr ng-controller-start="myController">
    <td>{{firstName}}</td>
  </tr>
  <tr ng-controller-end>
    <td>{{lastName}}</td>
  </tr>
</tbody>

{{firstName}}已正确替换。但是{{lastName}}是空的。由于{{firstName}}有效，因此AngularJS可以识别ng-controller-start。这是一个错误，或者我做错了，{{lastName}}无法正常工作？

更新如果未正式支持ng-controller-start和ng-controller-end。如何让ng-controller跨越多个元素？我可以使用comment-style指令吗？如果有，怎么样？

Answer 1

指令是否支持此指令是基于其指令定义和multiElement属性。

Angular的文档似乎并不是说哪个内置指令是多元素的，但a Github search似乎表明它只是ngRepeat，ngSwitchWhen，ngSwitchDefault ，ngIf，ngShow和ngHide。

您也可以使用multiElement创建自己的指令。

Answer 2

在Angular 1.2

中

使用Angular 1.2，引入了对多元素指令的支持。看起来他们想到的具体用例是ngRepeat，因为据我所知，它没有被提升为与任何其他内置指令一起使用。但是，使用ngRepeat，它解决了一个非常特殊的问题，例如如何为每个项重复多个表行。

在1.2中，$compile服务将检测任何带有-start后缀的指令，并假设它是一对多元素指令属性之一（{ {3}}）。这会导致不良副作用，因为something-start服务在找不到多元素副本时会感到困惑。{/ p>

这会导致错误：$compile

Error: [$compile:uterdir] Unterminated attribute, found 'something-start' but no matching 'something-end' found.服务在将指令视为多元素时不加区别的事实是您可以在Angular 1.2中使用$compile和ng-controller-start的原因。但是，ngController指令并不是为处理多个元素而设计的，这就是它无法按预期工作的原因。它将作用于范围中的第一个元素，并忽略其余元素 - 正如您所观察到的那样。

在Angular 1.3

中

Angular 1.3修复了上述问题，要求通过在指令定义对象上使用新的ng-controller-end属性来明确定义任何多元素指令。 source

这意味着multiElement: true将不会在1.3中执行任何，因为它将导致编译器查找名为“ngControllerStart”的指令，该指令不存在。因此，指令属性将被忽略。

正如另一个答案所指出的，您现在可以在angular.js GitHub repo中搜索“multiElement”，以查看支持此功能的特定核心指令。

AngularJS多元素指令

2 个答案:

在Angular 1.2

在Angular 1.3