AngularJS Form ng-attr

Question

我正在尝试在表单无效时禁用按钮:

我没有任何帮助我尝试了以下

<form name="someForm" id="someForm">    
   <input type="submit" ng-attr-disabled="{{someForm.$valid}}" />
</form>

和

   <input type="submit" ng-attr-disabled="someForm.$valid" />

它们都不起作用,我做错了吗？

我可以使用它来工作:

            <input type="submit" ng-show="someForm.$valid" />
            <input type="submit" ng-hide="someForm.$valid" disabled />

但它似乎错了:-(

我应该如何使用ng-attr指令访问表单并在表单无效时设置disabled属性？

Answer 1

你可以使用ng-disabled指令.

<input type="submit" ng-disabled="someForm.$valid" />

当您执行ng-attr-disabled="{{someForm.$valid}}"所发生的操作时,它将放置属性disabled="true"或disabled="false"禁用属性仍然存在,无论是真还是假,它将始终禁用该按钮.disabled属性(如果存在)将禁用输入,必须完全不存在才能启用它.ng-disabled属性清楚地处理它.可以将属性disabled设置为true/false而不禁用属性.

您还需要为表单内的任何输入(不是按钮)添加ng-model和名称,以便将其添加到formcontroller.

演示

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.3/angular.min.js"></script>
<div ng-app>
  <form name="someForm" novalidate>

    <input type="text" name="mod" ng-model="mod" required />
    <input type="submit" ng-disabled="someForm.$invalid" />
  </form>
</div>