AngularJs ng-wenn text ändern?

Bin ich angesichts des folgenden code

 <h2>{{ownername}} Online Bookshop</h2>
 <input placeholder="type your name" ng-model="ownername" >

Welche Ausgänge 'Online-Buchhandlung'

und wenn ich input 'Fred' es gibt 'Fred Online-Buchhandlung'

Ohne die Verwendung von jQuery, und Dinge zu tun, die kantige Art und Weise, wie müsste ich den code ändern, so dass eine besitzanzeigende Apostroph und den Buchstaben s wurden Hinzugefügt, wenn die Eingabe nicht leer ist?

ZB

Online-Buchhandlung, wenn Eingabe leer ist, und

Fred ' s Online-Buchhandlung, bei der Eingabe enthält 'Fred' string

InformationsquelleAutor PrimeLens | 2014-05-24
  1. 17

    Denken Sie daran, dass der Geltungsbereich ist nur ein Ort, wo können Sie Dinge bewerten. Also das ist genau das, was wir tun können. Die ? ist ein ternärer operator der form: (expression)?<true clause>:<false clause>; ist und gleich:

    if(expression) { <true clause>; }
else { <false clause>; }

    Modifizierte code:

    <h2>{{ ownername.length ? ownername + "'s " : "" }}Online Bookshop</h2>
<input placeholder="type your name" ng-model="ownername" >

    Edit:
    Obwohl diese Werke, die Ihr wahrscheinlich besser als andere weisen darauf hin, verbergen die Logik, aus dem Blick. Dies kann getan werden durch den Aufruf der scope-Funktion oder Anwendung eines filters auf die variable zu transformieren, wie erwartet.

    • außer Sie nicht verwenden können, ternärer operator in eckigen diesem Weg.
    • dadurch erhalten Sie einen lexer error : Lexer Fehler: Unerwarteter nächste Zeichen in den Spalten 18-18 [?] in Ausdruck [ ownername.Länge ? ownername + "'s" : "" ].
    • AngularJS unterstützt den ternären operator seit mehr als einem Jahr
    • sorry war nicht bewusst, mein test war mit 1.1.x, von Ihnen positiv bewertet werden Antwort
    • ternäre funktionieren wird, aber es ist fast immer eine schlechte Idee, Logik hinzufügen, um Ihre Ansicht. @theJoeBiz ist richtig, das ist genau, was angular Filter sind für.
    • Obwohl Sie dies tun können, hinzufügen von Logik, um Ihre Sicht ist so etwas eine schlechte Praxis. Ich würde empfehlen, sich in einen filter zu definieren, die transformiert Ihre Daten entsprechend.

    InformationsquelleAutor sabhiram
  2. 4

    Einen filter verwenden!

    app.filter('possessive', function() {
  return function(val) {
    if (!val) return '';
    return val + '\'s';
  };
});

    Dann:

    <h2>{{ ownername | possessive }} Online Bookshop</h2>
    • Ich kann nicht diese Arbeit
    • Dieser arbeitete für mich. Ich brauchte, um zu ändern, true/false, yes/no auf ein bool.
    InformationsquelleAutor theJoeBiz
Schreibe einen Kommentar