0
我试图阻止用户从下方如何使用NG-禁用,以防止用户重新提交表单
<button class="submit" ng-disabled="form_login.$submitted" type="submit"></button>
代码重新提交登录表单但是,这将禁用只要提交按钮,按钮即使用户提交了无效数据,也会被点击。只有在提交有效信息后才停止提交按钮的正确方法是什么?
我试图阻止用户从下方如何使用NG-禁用,以防止用户重新提交表单
<button class="submit" ng-disabled="form_login.$submitted" type="submit"></button>
代码重新提交登录表单但是,这将禁用只要提交按钮,按钮即使用户提交了无效数据,也会被点击。只有在提交有效信息后才停止提交按钮的正确方法是什么?
您可以使用ng-required
属性( directive
),它将检查元素的状态。
试试这个:
var app = angular.module('plunker', []);
app.controller('MainCtrl', function($scope) {});
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<!DOCTYPE html>
<html ng-app="plunker">
<head>
<meta charset="utf-8" />
<title>AngularJS Plunker</title>
<script>
document.write('<base href="' + document.location + '" />');
</script>
<link rel="stylesheet" href="style.css" />
<script data-require="[email protected]" src="https://code.angularjs.org/1.4.8/angular.js" data-semver="1.4.8"></script>
<script src="app.js"></script>
</head>
<body ng-controller="MainCtrl">
<form action="#" method="post" name="myForm">
Name::
<input type="text" ng-model="name" ng-required='true'>
<input type="submit" ng-disabled="myForm.$invalid" value="Submit">
</form>
</body>
</html>
虽然你的问题是不明确的,但你可以试试这个,
这里是HTML:
<form action="#" method="post">
Name::<input type="text" ng-model="name" ng-keyup="dirty()">
Address::<input type="text" ng-model="address" ng-keyup="dirty()">
<input type="submit" ng-disabled="error" value="Submit">
</form>
这里是JS:
angular.module('myApp', []).controller('ctrl', function($scope){
$scope.error = true; //Disables button initially
$scope.dirty = function(){
if($scope.name!='' && $scope.address!='')//Check conditions here
{
$scope.error = false; //Enables the button
}
}
});
您是否试图与 'form_login $无效' –