使用ng-disabled启用/禁用按钮 [英] Using ng-disabled to enable/disable button
本文介绍了使用ng-disabled启用/禁用按钮的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
我在表单的提交按钮中使用了ng-disabled.当我填写该字段时，inputForm.$ valid应该为true，并且ng-enable应该获得此true值，从而启用按钮.
I am using ng-disabled in submit button of the form. When I fill in the field, the inputForm.$valid should be true and the ng-enable should get this true value, thereby enabling the button.
<!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>但是即使输入了字段也没有启用按钮.我在做什么错了?
but the button is not getting enabled even when the fields are typed in. what am i doing wrong?
推荐答案
您应使用:
ng-disabled="inputForm.$invalid"
，以便在表单无效时禁用该表单.请注意，不要将无效属性放在方括号中.
in order to disable the form whenever the form is invalid. Note that you don't place the invalid property in brackets.
完整的< 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>
这篇关于使用ng-disabled启用/禁用按钮的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
