Я хочу изменить основной цвет на одной странице и установить для остальной части приложения.
Я следую этому уроку, чтобы сделать это https://robferguson.org/blog/2017/11/12/theming-your-ionic-3-app/, поэтому пытаюсь приспособиться к моему контекстуэто то, что я делаю.
app.html
<ion-nav [root]="rootPage" #content [class]="theme"></ion-nav>
app.component.ts
export class MyApp {
rootPage:any = WelcomePage;
public theme: String = 'theme';
constructor(platform: Platform, public event: Events ) {
platform.ready().then(() => {
event.subscribe('theme:toggle', () => {
this.toggleTheme();
});
});
}
public toggleTheme() {
console.log('tooogletheme')
if (this.theme === 'theme') {
this.theme = 'theme2';
} else {
this.theme = 'theme';
}
}
/ theme / variables.scss
$theme_color: #063351; //Default
$colors: (
primary: $theme_color,
secondary: #32db64,
danger: #f53d3d,
/ theme / theme.scss
.theme {
$theme_color: rgb(0, 152, 145) !global;
}
/ theme / theme2.scss
.theme2 {
$theme_color: rgb(255,77,90) !global;
}
И я хочу изменить его с другой страницы, поэтому я звоню ...
this.event.publish('theme:toggle');
событие вызывается, но ничего не происходит.
Спасибо за любую помощь.
Редактировать:
Я вижу изменения имени классавнутри Ion Nav, когда я вызываю событие, чтобы переключить класс.но я не знаю, меняется ли $ theme-color или класс не применяется к содержимому.
