Les composants sont les briques fondamentales de toute application Angular. Chaque composant comporte trois parties :
- Une classe TypeScript
- Un template HTML
- Des styles CSS
Note : Pour en savoir plus, consultez les composants dans le guide des Fondamentaux.
Dans cette activité, vous allez apprendre à mettre à jour le template et les styles d'un composant.
C'est une excellente occasion de faire vos premiers pas avec Angular.
-
Mettre à jour le template du composant
Mettez à jour la propriété
templatepour qu'elle afficheHello Universetemplate: ` Hello Universe `,Quand vous avez modifié le template HTML, l'aperçu s'est mis à jour avec votre message. Allons un peu plus loin : changez la couleur du texte.
-
Mettre à jour les styles du composant
Mettez à jour la valeur des styles et changez la propriété
colordeblueà#a144eb.styles: ` :host { color: #a144eb; } `,En regardant l'aperçu, vous verrez que la couleur du texte a changé.
Dans Angular, vous pouvez utiliser tout le CSS et le HTML pris en charge par le navigateur. Si vous le souhaitez, vous pouvez placer votre template et vos styles dans des fichiers séparés.