问题
I have an angular 2 application in which I'd like to implement the ability for a user to choose their color theme from a list of predetermined color palettes. When they select a theme, ALL relevant instances of color, background-color, etc will be changed to the corresponding new color from the theme palette. Is there any way to implement this from an Angular controller?
I know that you can conditionally add classes to specific elements using [class.className] or [ngClass] but obviously it is not practical to have to change the styles individually on every single attribute in a large application.
Specific use case: (click) listener attached to an "Update Theme" button is handled by a controller function used to change the css color values in .css file.
Has anyone implemented dynamic/user controlled themes/colors in Angular2? Any suggestions for how to approach this?
回答1:
bro the angular material team has worked in a very cool feature.
https://github.com/angular/material2/blob/master/guides/theming.md
if you want to see a working example https://material.angular.io/ has a theme picker in the navbar.
来源:https://stackoverflow.com/questions/44707407/angular2-update-all-color-assignments-in-css-dynamically