以多种形式监听 ng-dirty答案

【问题标题】：Listen for ng-dirty in multiple forms以多种形式监听 ng-dirty
【发布时间】：2014-03-07 16:42:09
【问题描述】：

我正在使用 AngularJs 构建应用程序

在我的一个模板部分中，我使用“ng-repeat”来生成多个表单：

<ul class="small-block-grid-2 medium-block-grid-3 large-block-grid-4 usbDevices">
  <li ng-repeat="usbDevice in usbDevices">
    <div class="block">
      <form name="form{{usbDevice.id}}">
        <!-- input fields -->
      </form>
    </div>
  </li>
</ul>

当其中任何一个表单显示“ng-dirty”时，我该如何做到这一点，底部会显示“保存”按钮？我需要观察者吗？

<a href="#" class="button expanded">Save</a>

【问题讨论】：

ng-dirty 只是因为某种原因听起来不对。
我希望在用户对任何字段进行任何更改后立即显示“保存”按钮。当用户进行一些修改时，“ng-dirty”类被添加到表单中。（如果我错了，请纠正我）

标签： javascript forms angularjs

【解决方案1】：

您可以将其全部包装在 ng-form 中，例如：

 <body ng-controller="MainCtrl" ng-form="MainForm">
    <ul class="small-block-grid-2 medium-block-grid-3 large-block-grid-4 usbDevices" >
      <li ng-repeat="usbDevice in usbDevices">
        <div class="block">
          <form name="form{{usbDevice.id}}">
            <input required ng-model="usbDevice.description" >
          </form>
        </div>
      </li>
    </ul>
    <button ng-show="MainForm.$valid">Save</button>
  </body>

工作：http://plnkr.co/edit/Z0CyyoqVHzs4ZV1F6uG4

【讨论】：