15.06.2018 Views

Anglar6 tutorial

A tutorial for Angular6. Please have a look to the Github repository NGNews6.

A tutorial for Angular6. Please have a look to the Github repository NGNews6.

SHOW MORE
SHOW LESS

You also want an ePaper? Increase the reach of your titles

YUMPU automatically turns print PDFs into web optimized ePapers that Google loves.

é<br />

Angular<br />

© Gérald Abbadie 2018<br />

Date<br />

Slice<br />

Curency s’intéresse à … la monnaie...<br />

{{ 10.6 | currency:'CAD' }} > renvoie 'CA$10.60’<br />

{{ 10.6 | currency:'CAD':'symbol-narrow' }} > renvoie '$10.60'<br />

{{ 10.6 | currency:'EUR':'code':'.3' }} > renvoie 'EUR10.600'<br />

Le traitement des dates se base sur les mêmes règles que dans les autres langages. Les variables<br />

consommées peuvent être en millisecondes ou un objet Date :<br />

{{ naissance | date:'dd/MM/yyyy' }} > 05/03/1970<br />

{{ naissance | date:'longDate' }} > July 16, 1986<br />

Ca marche aussi pour les heures :<br />

{{ naissance | date:'HH:mm' }} > 15:30<br />

{{ naissance | date:'shortTime' }} > 3:30 PM<br />

Le slice en pipe agit peu ou prou comme son parent en Javascript.<br />

Dans un tableau, affichons les premiers éléments<br />

{{ monTableau | slice:0:3 }}<br />

Ca marche aussi sur des chaînes<br />

{{ ‘Ma chaîne de caractères | slice:3:9 }}<br />

On peut jouer jusqu’à la fin ou à partir de la fin<br />

{{ monTableau | slice:3 }}<br />

{{ monTableau | slice:-2 }}<br />

Il marche aussi avec ngFor<br />

{{ t.nom }}<br />

{{ t.nom }}<br />

Et aussi avec un alias<br />

{{ total.length }} : {{ t.nom }}`<br />

35

Hooray! Your file is uploaded and ready to be published.

Saved successfully!

Ooh no, something went wrong!