使用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啓用/禁用按鈕

回答

相關問題