javascript - 我可以在 AngularJS 的指令声明中连接吗？

Question

我有一个带有 ng-repeat 指令的表单。我正在使用 ng-show 来显示验证错误消息。我尝试在 ng-repeat 指令中添加验证消息，但遇到了麻烦。这是我到目前为止所拥有的:

<form name="rentalApp" ng-controller="RentalAppCtrl">
  <label for="name">Full Name</label>
  <input id="name" name="name" ng-model="app.name">
  <div ng-show="rentalApp.name.$invalid">Please enter your name</div>

  <div ng-repeat="history in app.history">
    <label for="address{{ $index }}">Street Address</label>
    <input id="address{{ $index }}" name="address{{ $index }}" ng-model="history.address">
    <div ng-show="rentalApp.('address' + $index).$invalid">Please enter an address</div>
  </div>
</form>

如您所见，我使用 $index 变量来确保我的 ID 和名称是唯一的。

在我的表格的其余部分中，我正在做一些类似的事情:

<div ng-show="rentalApp.whatever.$invald">Error Message</div>

我遇到的问题是，在 ng-repeat 指令中，索引是动态的。我已经摆弄这个问题有一段时间了，我认为我最接近的解决方案是这一行:

<div ng-show="rentalApp.('address' + $index).$invalid">Please enter an address</div>

但是这不起作用。

如何正确地将单词“address”与 $index 变量连接起来，以沿着 address0 的行创建一个字符串，然后可以在我的ng-show 指令来确定表单元素是否无效？或者，我的做法是否完全错误(不是“Angular 方式”)？

编辑

我正在从控制台查看 rentalApp 对象，而 AngularJS 并未按照我的预期评估 name 属性。具体来说，rentalApp 对象包含 address{{ $index }} 对象，而不是 address0。所以看起来我无法在 name 属性中使用表达式 {{ $index }} 。

Answer 1

更新

我进行了一项研究，发现除了为其创建自定义指令之外，不可能为名称提供动态值...

但是有一个解决方案可以让您使用 ng-form 指令为每个单独的 ng-repeat 元素验证动态表单...

<div ng-repeat="history in app.history">
      <ng-form name="addressForm">
          <label>Street Address</label>
          <input name="address" ng-model="history.address" ng-required="true">
          <div ng-show="rentalApp['address' + $index].$invalid">Please enter an address</div>
          <span class="alert error" ng-show="addressForm.address.$invalid">Please enter an address</span>
      </ng-form>
</div>

这是你的 PLUNKER ...