Dyrektywa ponownego użycia ngClass w AngularJS

Question

Próbuję sprawdzić poprawność formularza, a na stronie html jest zbyt dużo logiki. Używam już narzędzia ngMessages, ponieważ bez niego jest beznadziejnie.

robie wariantu wynikowego NG-klasy jak ten

ng-class="{ 'has-error' : registerForm.username.$invalid && registerForm.username.$touched, 'has-success' : registerForm.username.$valid && registerForm.username.$touched }" 

Jak widać nie ma już dużo kodu już w powyższej linii. Muszę użyć tej dyrektywy 6 razy, więc jedyną opcją, jaką wydaje mi się teraz, jest skopiowanie wklejenia 5 innych miejsc. Próbowałem zrobić coś takiego, ale to nie działa

<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> 

ja nie rozumiem, dlaczego to nie działa. Czy masz jakieś inne sugestie co do możliwości ponownego użycia powyższego kodu?

Answer 1

Jak o:

ng-class="getFormClasses(registerForm)" 

I w swoim wspólnym sterownikiem:

$scope.getFormClasses = function(form) { 
    if (!form) { return; } 
    return { 
    'has-error' : form.username.$invalid && form.username.$touched, 
    'has-success': form.username.$valid && form.username.$touched 
    } 
}; 

Jeśli używasz ng-init, zajęcia nie zostaną zaktualizowane, gdy zmiany forma ważności.