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.
Create successful ePaper yourself
Turn your PDF publications into a flip-book with our unique Google optimized e-Paper software.
é<br />
Angular<br />
© Gérald Abbadie 2018<br />
On peut aussi ouvrir une adresse en important la classe Router et en l’instanciant de la même<br />
manière dans le constructeur. Nous pouvons ensuite activer la navigation depuis le composant<br />
et passer des paramètres :<br />
this.router.navigate(['/product-details', id]);<br />
Les services & l'appel de données<br />
Les services sont des injectables. Ils sont dédiés à être partagés entre différents composants et<br />
donc particulièrement adaptés au chargement de données externes.<br />
Créer un service<br />
La commande est simple :<br />
ou<br />
ng generate service monServ<br />
ng g s monServ<br />
Pour mémoire, les services sont effectivement instanciés<br />
dans le tableau des providers du module qui<br />
le déclare<br />
Notre service sera automatiquement injecté dans le module, dans le tableau "providers". Il peut<br />
être ensuite instancié dans des composants :<br />
constructor(private donnees:AnewsService){}<br />
Il peut ainsi être utilisé dans le code, ses propriétés et méthodes publiques peuvent ainsi devenir<br />
accessibles au composant :<br />
this.actuId = this.donnees.getInfos();<br />
mais aussi dans le template du composant :<br />
{{donnees.article}}<br />
C'est redoutablement efficace pour une gestion centralisée des données.<br />
Appeler des données externes<br />
Plusieurs mécaniques sont nécessaires au chargement et à l’exploitation des données. HttpClient<br />
fournie par Angular est la classe de base pour l'appel de données en Ajax. Elle doit être<br />
importée et instanciée. Voici un exemple :<br />
27