My final Angular app has a multitude of routes and modules that it loads. Recently, I've been encountering an error in the console stating "Zone is already loaded", and now I'm seeing it appear twice.
I've tried examining the zone object to understand what's causing this issue, but figuring it out without knowing the intended function of the zone is proving to be quite challenging.
Main.ts
import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
import { enableProdMode } from '@angular/core';
import { environment } from './app/';
import {AppModule} from './app/app.module';
enableProdMode();
platformBrowserDynamic().bootstrapModule(AppModule,[]);
app.module.ts (I have omitted some imports):
@NgModule({
imports: [ BrowserModule, RouterModule.forRoot(appRoutes), SharedModule.forRoot(),
HomeModule, DocumentsModule, AboutModule, SettingsModule, FoodModule, CalculatorModule,
ThemesModule ],
declarations: [ AppComponent ],
bootstrap: [ AppComponent ],
providers: [ appRoutingProviders ]
})
export class AppModule {}
app.component.ts
@Component({
moduleId: module.id,
selector: 'kg-root',
templateUrl: 'app.component.html',
styleUrls: ['app.component.css']
})
export class AppComponent implements OnInit {
private items: MenuItem[];
appPageHeaderDivStyle: {};
selectedTheme: Theme;
errorMessage: string;
loggedIn: LoggedIn;
loggedInEmail: string = "";
isLoggedIn: boolean;
constructor(
private as: AppMenuService,
private ts: ThemeService,
private ss: SettingsService,
private ls: LoginService) {
}
ngOnInit() {
this.ts.getNewTheme()
.subscribe(
theme => this.selectedTheme = theme,
error => {
this.errorMessage = error
},
() => this.completeGetNewTheme()
);
this.ts.setTheme("Pepper-Grinder");
this.items = this.as.getNoLoginMenu();
this.ls.getLoggedIn()
.subscribe(
loggedIn => {
if (loggedIn.error != undefined && loggedIn.error === "" && loggedIn.email != "") {
this.items = this.as.getLoggedInMenu();
var us = this.ss.getUserSettings();
if (us != undefined && us.theme != null && us.theme != "") {
this.ts.setTheme(us.theme);
}
}
else {
this.items = this.as.getNoLoginMenu();
this.ts.setTheme("Pepper-Grinder");
}
this.completeLoggedIn(loggedIn.email);
});
}
completeLoggedIn(email: string) {
this.loggedInEmail = email;
this.isLoggedIn = (this.loggedInEmail.length > 0);
}
completeGetNewTheme() {
this.appPageHeaderDivStyle = this.ts.getAppPageHeaderDivStyle();
}