angolare, ng-se modificare il testo?

Question

mi sono dato il seguente codice

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

quali uscite 'online Bookshop'

e se io ingresso 'Fred' 'uscite 'Fred in linea Bookshop'

Senza usare jQuery, e facendo cose il modo angolare, come dovrei cambiare il codice in modo che un apostrofo possessivo e la lettera s sono stati aggiunti quando l'input non è vuoto?

EG

libreria online quando l'input è vuoto, e

di Fred in linea Bookshop quando l'ingresso contiene 'Fred' stringa

Answer 1

Ricordate che il campo di applicazione è solo un luogo dove si possono valutare le cose. Questo è esattamente quello che possiamo fare. Il ? è un operatore ternario della forma: (expression)?<true clause>:<false clause>; ed è pari a:

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

Codice modificato:

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

Edit: Anche se questo funziona, la sua, probabilmente meglio come altri sottolineano per nascondere la logica dalla vista. Questo può essere fatto chiamando una funzione scope o applicando un filtro alla variabile per trasformarla come previsto.

Answer 2

Utilizzare un filtro!

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

Poi:

<h2>{{ ownername | possessive }} Online Bookshop</h2>