使用ng-disabled启用/禁用按钮

我在表单的提交按钮中使用了ng-disabled。当我填写该字段时，inputForm。$ valid应该为true，并且ng-enable应该得到这个真值，从而启用该按钮。使用ng-disabled启用/禁用按钮

<!DOCTYPE html> 
 
<html xmlns="http://www.w3.org/1999/xhtml"> 
 
<head > 
 
    <title></title> 
 
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.6/angular.min.js"></script> 
 
</head> 
 
<body ng-app=""> 
 

 
    <form name="inputForm" > 
 
     <div> 
 
      <label>Name</label> 
 
      <input type="text" name="name" required /> 
 
     </div> 
 
     <div> 
 
      <label>Email</label> 
 
      <input type="text" name="email" required/> 
 
     </div> 
 

 
     <button type="submit" ng-disabled="{{inputForm.$valid}}"> 
 
      Submit 
 
     </button> 
 
    </form> 
 

 
    {{inputForm.$valid}} 
 
    {{inputForm.$invalid}} 
 
    {{inputForm.$dirty}} 
 
    {{inputForm.$pristine}} 
 
</body> 
 
</html>

但即使领域中类型的。我在做什么错了按钮是没有得到启用？

来源

2016-08-04 Shorn Jacob

您应该使用：

ng-disabled="inputForm.$invalid"

以禁用窗体每当形式是无效的。请注意，您不要将无效的属性放在括号中。

完全<form>代码：

<form name="inputForm" > 
    <div> 
     <label>Name</label> 
     <input type="text" name="name" required /> 
    </div> 
    <div> 
     <label>Email</label> 
     <input type="text" name="email" required/> 
    </div> 

    <button type="submit" ng-disabled="inputForm.$invalid"> 
     Submit 
    </button> 
</form>

来源

2016-08-04 11:22:17

变化ng-disabled="inputForm.$valid到ng-disabled="inputForm.$invalid或ng-disabled="!inputForm.$valid，要禁用按钮时表单有效

来源

2016-08-04 11:18:29

是要禁用按钮时的形式是有效的。这只是一个模拟理解工作 –

使用ng-disabled启用/禁用按钮

回答

相关问题