Reuse Директива ngClass в AngularJS

Question

Я пытаюсь проверить форму, и на html-странице существует слишком много логики. Я уже использую ngMessages, потому что без него это безнадежно.

Я делаю вариант объектного нг-класса, как этот

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> 

Не понимаю, почему это не работает. Есть ли у вас какие-либо другие рекомендации по повторному использованию кода выше?

Answer 1

Как насчет:

ng-class="getFormClasses(registerForm)" 

И в вашем общем контроллере:

$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, классы не будут обновляться при изменении формы валидности.