我正在尝试验证表单,但 html 页面中的逻辑太多了。我已经在使用 ngMessages,因为没有它就毫无希望了。
我正在像这样做 ng-class 的对象变体
ng-class="{ 'has-error' : registerForm.username.$invalid && registerForm.username.$touched, 'has-success' : registerForm.username.$valid && registerForm.username.$touched }"
如您所见,上述行中已经有很多代码。我必须使用这个指令 6 次,所以我现在唯一的选择是复制粘贴到其他 5 个地方。我尝试做这样的事情,但没有奏效
<form ng-init="formGroupClassObject = { 'has-error' : registerForm.username.$invalid && registerForm.username.$touched, 'has-success' : registerForm.username.$valid && registerForm.username.$touched }">
<div class="form-group" ng-class="formGroupClassObject"></div>
我不明白为什么这不起作用。您对上述代码的重用能力还有其他建议吗?
最佳答案
怎么样:
ng-class="getFormClasses(registerForm)"
在您的通用 Controller 中:
$scope.getFormClasses = function(form) {
if (!form) { return; }
return {
'has-error' : form.username.$invalid && form.username.$touched,
'has-success': form.username.$valid && form.username.$touched
}
};
如果您使用
ng-init
,当表单有效性更改时,类将不会更新。
关于angularjs - 在 AngularJS 中重用 ngClass 指令,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/29856773/