我的Angular验证类存在问题。我的css中有三个类有三个不同的图像,如果用户填写正确与否,则显示该字段是否必需。例如。我有一个输入字段,用户输入一个个人号码,我在服务中查找并用名字,姓氏,地址等填充模型,这也填充了输入字段。
我做了一个简单的例子
HTML
<div ng-app="ebu" ng-controller="search">
<button id="search-apparentice" ng-click="addName()">Search apprentice</button>
<hr>
<input id="username" type="text" ng-model="user.name" required>
</div>
JS
angular.module('ebu', []).
controller('search', function($scope) {
$scope.user = {};
$scope.addName = function()
{
$scope.user.name = "Kasper";
}
})
CSS
input[required].ng-invalid
{
border: 1px solid red;
}
input[required].ng-valid
{
border: 1px solid green;
}
input[required].ng-pristine
{
border: 1px solid blue;
}
[FiddleJS] [1] [1]:http://jsfiddle.net/kaspergantzhorn/z1wg6tko/9/
答案 0 :(得分:0)
它仍然质朴,因为原始意味着它从未有过焦点。用户没有点击它,因此它永远不会变脏。如果这不是用户修改的字段,那么pristine不适合使用。
此外,在输入的ng-change中,您应该可以使用$ setDirty。
<input type="text" ng-change="formName.inputName.$setDirty()" />
上面的代码:
<div ng-app="ebu" ng-controller="search">
<button id="search-apparentice" ng-click="addName(); myForm.name.$setDirty()">Search apprentice</button>
<hr>
<form name="myForm">
<input name="name" id="username" type="text" ng-model="user.name" required>
</form>
</div>