Wie ng-Nachricht Nachrichten

Question

Ich bin neu in AngularJS kombinieren, aber ich habe intensiv gesucht und konnte eine Arbeits Antwort auf diese Frage nicht finden, vielleicht ist es einfach nicht möglich, die Art, wie ich es im Sinn haben.

Was ich möchte, ist in der Lage, Fehlerbedingungen zu kombinieren, so dass ich allgemeinere Fehlermeldungen im ng-messages Modul verwenden kann. Dies spart uns viel Zeit bei der Pflege von Texten, da unsere Anwendung mehrsprachig ist. In meinem Beispiel wäre es toll, minlength, maxlength und pattern zu kombinieren und 1 generische Nachricht zu referenzieren. Der einzige Weg, wie ich es zum Laufen gebracht habe, ist eine separate ng-Nachricht für jeden Typ und dann den Fehlertext wiederzuverwenden, der mir überflüssig erscheint. Hoffentlich ist es etwas Kurzes, das ich vermisse, wenn ich nicht verstehe, wann/wie ich es benutzen soll, oder ||.

<form id="myFormId" name="myForm" novalidate> 
    <input name="sText" ng-model="someText" 
    type="text" 
    required 
    ng-minlength="8" minlength="8" 
    ng-maxlength="8" maxlength="8" 
    ng-pattern="/^[a-zA-Z0-9]{8,8}$/" pattern="/^[a-zA-Z0-9]{8,8}$/"> 

<div ng-messages="myForm.sText.$error" role="alert"> 
    Error message: 
    <div ng-message="required">Required text missing</div> 
    <div ng-message="minlength || maxlength || pattern">Not right length or bad pattern - Why does this not work? I have also tried using comma , instead of || </div> 
    <div ng-message="minlength">Too short - this does work but does not change even if this is removed</div> 
</div> 
</form> 

Ich habe this simple Plunk geschaffen zu illustrieren, was ich zu tun versucht:

EDIT 1

ich weiß, ich einen einzigen RegexMuster Ausdruck verwenden könnte, aber die oben genannten Validierungen ist streng reproduzieren Sie das Problem und zeigen Sie ein Beispiel. Ich habe noch andere Validierungen, die ich kombinieren möchte und die nicht mit einem einzigen Muster ausgedrückt werden können.

Answer 1

ng-messages wird Fehlermeldung innerhalb ng-messages Richtlinie Elements zeigen, aber das hat Einschränkung, dass Sie nur einzelne Fehler ng-message innerhalb des ng-messages div anzeigen können.

Wenn Sie also mehrere ng-message innerhalb ng-messages Richtlinie zeigen wollte, müssen Sie hinzufügen ng-messages-multiple Attribut auf ng-messages Richtlinie Element.

Docs Link

Markup

<div ng-messages="myForm.sText.$error" role="alert" ng-messages-multiple> 
    Error message: 
    <div ng-message="required"> 
     Required text missing 
    </div> 
    <div ng-message="minlength, maxlength, pattern"> 
     Not right length or bad pattern - Why does this not work? I have also tried using comma , instead of ||(OR) 
    </div> 
    <div ng-message="minlength"> 
     Too short - this does work but does not change even if this is removed 
    </div> 
</div> 

Working Plunkr

aktualisieren

Nach Winkel Dokument updation kam ich zu wissen, dass ng-messages nicht sh unterstützt ow mehrere ng-message Fehler innerhalb ng-messages, zur Lösung dieses Problems sollten wir ng-messages-multiple Attribut auf ng-messages Element haben.

Von Docs

standardmäßig ngMessages wird erst zu einem Zeitpunkt ein Fehler angezeigt werden soll. Wenn Sie jedoch alle Nachrichten anzeigen möchten, kann das Attributattribut ng-messages-multiple für das Element mit der ngMessages-Direktive verwendet werden, um dies zu ermöglichen.

Markup

<div ng-messages="myForm.sText.$error" role="alert" ng-messages-multiple> 
    Error message: 
    <div ng-message="required"> 
     Required text missing 
    </div> 
    <div ng-message="minlength, maxlength, pattern"> 
     Not right length or bad pattern - Why does this not work? I have also tried using comma , instead of ||(OR) 
    </div> 
    <div ng-message="minlength"> 
     Too short - this does work but does not change even if this is removed 
    </div> 
</div> 

Working Plunkr

Answer 2

Inorder auf Ihre ng-Nachricht allgemeineren machen Sie alle Ihre Nachrichten Fehler halten können es an einem Ort und verwenden, wenn erforderlich. Sie könnten dies mit ng-message-include tun.

Werfen Sie einen Blick auf: Reusing und Übergeordnete Fehlermeldungen

http://www.yearofmoo.com/2014/05/how-to-use-ngmessages-in-angularjs.html#reusing-and-overriding-error-messages.

Ich glaube, Sie dies implementieren mögen.

Answer 3

In Angular 1.4 Sie mehrere Fehler für eine ng-Nachricht angeben:

<div ng-message="minlength, maxlength"> 
    Your email must be between 5 and 100 characters long 
</div> 

Siehe documentation