Espressioni in AngularJS

Quando si lavora sui template, molte volte abbiamo bisogno di renderli più intelligenti, questo significa andare un passo oltre la semplice visualizzazione dei dati, ma questo non deve significare che facciamo tutto il lavoro in quella che dovrebbe essere l'unica interfaccia di uscita per l'utente.
AngularJS ci offre quello che si chiama espressioni, che sono operatori di confronto, logici e aritmetici, con i quali possiamo fornire intelligenza al template e interagire così in maniera più avanzata con il controller.
espressioniLe espressioni ci consentono di creare modelli che possono essere più intelligenti, con questo possiamo esprimere sia l'interfaccia che i cambiamenti di comportamento a seconda dei dati che il controller ci offre.
Usando le espressioni, possiamo ottenere comportamenti dinamici dei nostri modelli, qualcosa che può aiutare a migliorare l'esperienza dell'utente e quindi guidarli nel percorso di buon uso della nostra applicazione.
Per farlo possiamo utilizzare una serie di gadget, che pur non essendo larghi e profondi come JavascriptDanno molto spazio di manovra. È importante non essere tentati di utilizzare espressioni per costruire la logica nei nostri modelli, poiché ne distorceremmo la funzione e aggiungeremmo complessità non necessarie alle nostre applicazioni.
Le espressioni che possiamo usare sono:
AritmeticaCome addizione (+), sottrazione (-), moltiplicazione (*), divisione (/), ecc.
ConfrontoAd esempio maggiore (>) o minore (<) di, uguale (==) o diverso (! =) A e le loro combinazioni.
LogicaCome diversi (!), E (&&) o (||).
chiamateChiama i metodi e le funzioni del nostro controller con $ scope ({}).
Vediamo di seguito un piccolo esempio che può aiutarci a capire l'uso delle espressioni nei nostri template in un'applicazione realizzata con AngularJS.

Se guardiamo l'esempio abbiamo incorporato alcune espressioni, ad esempio possiamo accedere al metodo ricalcolare() e il suo risultato o ritorno lo dividiamo per 10, quindi in un elenco di elementi possiamo posizionare le classi CSS convalidando il resto dell'indice $ dividendo per 4 (indice $% 4) e quindi confrontando se è maggiore o uguale al risultato di un metodo chiamato limite.
Come si vede non è per niente difficile ed è molto utile avere questi strumenti, se esaminiamo meglio l'esempio noteremo anche che la nostra prima espressione pur essendo tecnicamente valida, la sua esistenza trasferisce la logica aziendale al modello.
L'espressione {{ricalcola () / 10}} Non dovrebbe essere utilizzato, se abbiamo bisogno del valore diviso per 10 del risultato del metodo ricalcola (), dobbiamo ottenerlo nel controller e non nel modello, quindi dovremmo creare un nuovo metodo che lo incorpori e quindi essere in grado di rispettare la separazione delle aree suggerita da MVC.
Con questo finiamo il tutorial, come vediamo AngularJS Ci fornisce gli strumenti per creare applicazioni di qualità, sfruttando tutte le risorse a cui possiamo pensare per realizzare applicazioni migliori.Ti è piaciuto e hai aiutato questo Tutorial?Puoi premiare l'autore premendo questo pulsante per dargli un punto positivo