Angulaire 5 et matériel - Comment changer la couleur d'arrière-plan snack bar composant
J'ai changer le fond de la buvette de la composante.
Je l'utilise pour alerter ou informer l'utilisateur sur certains d'erreur ou d'action terminée, l'utilisateur n'.
Le matériel version du projet.
"@angulaire/matériel": "^5.0.0-rc.1",
La documentation https://material.angular.io/components/snack-bar/api dire à propos d'un api pour modifier la classe.
panelClass: string | string[]
Extra classes CSS pour être ajouté au snack-bar conteneur.
C'est ce que j'ai ajouter dans le fichier css.
.mycsssnackbartest {
background-color: blue;
}
C'est le code pour ouvrir la buvette
this.snackBar.open('Informing the user about sth', 'User Message' , {
panelClass: ['mycsssnackbartest ']
} );
Ce que je fais mal?
MatSnackBarConfig
a un champ nomméextraClasses
"Extra classes CSS pour être ajouté au snack-bar conteneur." Vous utilisezpanelClass
, qu'il n'existe pas- Si trouvé panelClass dans la documentation de l'api. matériel.angulaire.io/composants/snack-bar/api. Je n'ai pas utilisé extraClasses parce que la documentation dit qu'elle est Obsolète. Mais je vais le tester. Merci.
Vous devez vous connecter pour publier un commentaire.
Vous devez utiliser le
panelClass
option (depuis la v6) à appliquer classes sur un casse-croûte comme ceci:CSS (dans les styles.scss):
Voir le Stackblitz exemple