AngularJS多元素指令

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的文档似乎没有说哪个内置指令是多元素的，但Github搜索似乎表明它只有ngRepeat ， ngSwitchWhen ， ngSwitchDefault ， ngIf ， ngShow和ngHide 。

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

Answer 2

在Angular 1.2中

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

在1.2中， $compile服务将检测任何带有-start后缀的指令，并假设它是一对多元素指令属性（ source ）之一。 这导致了不良的副作用，你无法将你的指令命名something-start ，因为$compile服务在找不到多元素对应时会感到困惑。

这会导致错误： Error: [$compile:uterdir] Unterminated attribute, found 'something-start' but no matching 'something-end' found.

$compile服务不分青红皂白地将指令视为多元素，这就是为什么你能够在Angular 1.2中使用ng-controller-start和ng-controller-end 。 但是，ngController指令并不是为处理多个元素而设计的，这就是它无法按预期工作的原因。 它将作用于范围中的第一个元素，并忽略其余元素 - 正如您所观察到的那样。

在Angular 1.3中

Angular 1.3通过在指令定义对象上使用新的multiElement: true属性要求显式定义任何多元素指令来解决上述问题。 请参阅相关文档

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

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