Télécharger : Travail Pratique 4 (Partie 3 - 4 , Directives et Pipes).docx

Angular, Directives et Pipes

Travail Pratique 4 (suite…)

5 points sur 30

Partie 3

3.   Structurez le document avec des Directives

a)     À l'aide des notes de cours (3 - Théorie Semaine 8 (Structurez le document avec des Directives).doc et du vidéo des notes de cours, Faites une copie de votre projet Angular de la Partie 2 pour faire la partie 3. (Copier-coller de votre dossier)

b)     Tester votre nouveau dossier. (ajuster les permission….)

c)     Dans mes exemples, j'ai utilisé comme sujet "Les voitures sports de luxe".  Poursuivez votre sujet choisi dans la partie 1 et 2.

d)     Créer un bouton vert et rouge comme dans les notes de cours pour déterminer si vos produits sont disponibles ou non.

e)     Ajoute la directive  *ngFor="let obj of myArray"  à un votre component qui affiche vos produit. (Comme dans les notes de cours)

f)      Modifier la couleur du texte dans votre component qui affiche vos produits pour déterminer si vos produits sont disponibles ou non. (Comme dans les notes de cours)

g)     Modifier la couleur du fond de votre liste qui affiche vos produits pour déterminer si vos produits sont disponibles ou non. (Comme dans les notes de cours)

h)     Ajouter un bouton non disponible à côté du bouton précédent. Ce bouton affichera dans la console "rien n'est disponible".

i)       Partie Directives terminer

Partie 4

     4.     Modifiez les données en temps réel avec les Pipes.

a)     À l'aide des notes de cours (4 - Théorie Semaine 8 (Modifiez les données en temps réel avec les Pipes).doc et du vidéo des notes de cours, continuez sur le même projet que la partie 3.

b)     Ajouter la date et l'heure juste avant l'affichage de vos produits à l'aide des pipes comme dans les notes de cours.

c)     Ajouter la date et l'heure qui change à toute les une seconde dans votre component qui contient votre nom.

d)     Indice : utiliser la fonction

e)     window.setInterval(()=>{observer.next(new Date().toLocaleString("fr-CA"))},1000);

f)     Vérifier le résultat et faites vérifiez par votre enseignant au besoin.

Tout le projet "TP4" sera à remettre en fin de session. (à peu près la semaine 13 à 15)