Aktualisierte Winkelversion verursacht Fehler bei ngMessages

Question

Ich aktualisierte AngularJs Version von 1.3 zu 1.4. Es verursacht einen Fehler wie

Syntax Error: Token '{' invalid key at column 2 of the expression
[{{frmname}}.emailAddress.$error] starting at [{frmname}}.emailAddress.$error].

Es funktioniert perfekt in Angular 1,3

<form name="{{frmname}}"> 
    <h1>My form name = {{frmname}}</h1> 
    <div class="field"> 
    <label for="emailAddress">Enter your email address:</label> 
    <input type="email" name="emailAddress" ng-model="email" required /> 
    <div ng-messages="{{frmname}}.emailAddress.$error"> 
     <div ng-message="required"> 
     You forgot to enter your email address... 
     </div> 
     <div ng-message="email"> 
     You did not enter your email address correctly... 
     </div> 
    </div> 
    </div> 
    <input type="submit" /> 
</form> 

FIDDLE

Answer 1

Schließlich ich die Lösung bekam,

eine Funktion für das Erhalten ng-Nachrichten Attribut hinzufügen Wert.

<div ng-messages="getMessages('emailAddress')"> 
    <div ng-message="required"> 
    You forgot to enter your email address... 
    </div> 
    <div ng-message="email"> 
    You did not enter your email address correctly... 
    </div> 
</div> 

Deklarieren Sie die Funktion in Ihrem Controller oder Richtlinie.

$scope.getMessages = function (el) { 
    return $scope.$eval($scope.frmname)[el].$error; 
} 

FIDDLE

Answer 2

Wenn Sie Ihre Formularnamen aus einer dynamischen Variable müssen dann könnte man ng-form verwenden validiere deine Eingaben innerhalb des aktuellen Formulars.

Grund html:

<form name="{{formName}}" novalidate> 

    <ng-form name="emailError"> 
    <div ng-messages="emailError.emailAddress.$error" style="color:maroon" role="alert"> 
     <label for="emailAddress">Enter your email address:</label> 
     <input type="email" name="emailAddress" ng-model="email" minlength="5" required /> 
     <div ng-messages="emailError.emailAddress.$error" style="color:maroon" role="alert"> 
     <div ng-message="required">You did not enter a field</div> 
    </div> 
    </ng-form> 

    <input type="submit" /> 

</form> 

Plunker: https://plnkr.co/edit/Q0ifmRXKkLfwKGNqv8p4?p=preview

Offizielle Dokumentation von ngForm: https://docs.angularjs.org/api/ng/directive/ngForm