带路由的angular2出错。然后安排执行更多任务，platform-b​​rowser.umd.js：937

Question

我是Angular 2的新手，我正在使用最新的Angular 2（RC5），我想介绍导航，它可以工作，但它没有加载默认选项（住院）我必须点击选项，应用程序在菜单的不同选项之间导航，但我在控制台中遇到问题：

EXCEPTION: Error: More tasks executed then were scheduled.
BrowserDomAdapter.logError  @platform-browser.umd.js:937

platform-browser.umd.js:937 Error: More tasks executed then were scheduled.
    at ZoneDelegate._updateTaskCount (zone.js:398)
    at ZoneDelegate.invokeTask (zone.js:369)
    at Zone.runTask (zone.js:265)
    at ZoneTask.invoke (zone.js:433)
    at XMLHttpRequest.<anonymous> (zone.js:93)
    at ZoneDelegate.invokeTask (zone.js:365)
    at Object.onInvokeTask (core.umd.js:9236)
    at ZoneDelegate.invokeTask (zone.js:364)
    at Zone.runTask (zone.js:265)
    at XMLHttpRequest.ZoneTask.invoke (zone.js:433)

我的主要是：

// main entry point
import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
import { AppModule } from './app.module';

platformBrowserDynamic().bootstrapModule(AppModule);

我的app.module.ts是：

import { NgModule }       from '@angular/core';
import { BrowserModule }  from '@angular/platform-browser';
import { FormsModule }    from '@angular/forms';
import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
import { HttpModule } from '@angular/http';

import { MainComponent }    from './component/main/component-main';
import { LoadService }      from './service/load-service';
import { routing } from './app.routing';

import { LocationsComponent }   from './component/locations/component-locations';
import { HospitalizationComponent }   from './component/hospitalization/component-hospitalization';
import { EpisodesComponent } from './component/episodes/component-episodes';
import { ListingsComponent } from './component/listings/component-listings';
import { ReportsComponent } from './component/reports/component-reports';

@NgModule({
  imports: [
    BrowserModule,
    HttpModule,
    FormsModule,
    routing
  ],
  declarations: [
    MainComponent,
    HospitalizationComponent,
    LocationsComponent,
    EpisodesComponent,
    ListingsComponent,
    ReportsComponent
  ],
  providers: [
    LoadService
  ],
  bootstrap: [ MainComponent ]
})
export class AppModule {
}

我的app.routing.ts是：

import { ModuleWithProviders }  from '@angular/core';
import { Routes, RouterModule } from '@angular/router';

import { LocationsComponent }   from './component/locations/component-locations';
import { HospitalizationComponent }   from './component/hospitalization/component-hospitalization';
import { EpisodesComponent } from './component/episodes/component-episodes';
import { ListingsComponent } from './component/listings/component-listings';
import { ReportsComponent } from './component/reports/component-reports';

const appRoutes: Routes = [
  {
    path: '',
    redirectTo: '/hospitalization',
    pathMatch: 'full'
  },
  {
    path: 'hospitalization',
    component: HospitalizationComponent
  },
  {
    path: 'locations',
    component: LocationsComponent
  },
  {
    path: 'episodes',
    component: EpisodesComponent
  },
  {
    path: 'listings',
    component: ListingsComponent
  },
  {
    path: 'reports',
    component: ReportsComponent
  }
];

export const appRoutingProviders: any[] = [

];

export const routing: ModuleWithProviders = RouterModule.forRoot(appRoutes);

和我的component-main.ts是：

import { Component, Input, Output } from '@angular/core';
import { PatientService }           from '../../service/patient-service';
import { MessageService }           from '../../service/message-service';
import { LoginService }             from '../../service/login-service';
import { LoadService }              from '../../service/load-service';
import { UserBean }                 from '../../bean/user-bean';
import { HeaderComponent }          from './component-header';
import { FooterComponent }          from './component-footer';
import { MenuLeftComponent }    from './component-menu-left';
import { HospitalizationComponent }     from '../hospitalization/component-hospitalization';

@Component({
    selector: 'component-main',
    templateUrl: './resources/template/component-main.html',
    styleUrls: ['./resources/css/component-main.css'],
    moduleId: module.id,
    providers: [MessageService, LoginService, LoadService],
    directives: [HeaderComponent, FooterComponent, MenuLeftComponent, HospitalizationComponent]
})

export class MainComponent {
    // private attributes
    private _userLoaded: boolean = false;
    private _messageLoaded: boolean = false;
    private _error: any = null;

    private _local: boolean = true;

    public _patient: any;
    public _user: UserBean;

    constructor(private _messageService: MessageService,
        private _loginService: LoginService,
        private _loadService: LoadService) {

        this.loadUser(_loginService);
        this.loadMessages(_messageService);
    }

    isloaded(): boolean {
        return this._messageLoaded /*&& this._patientLoaded*/ && this._userLoaded;
    }

    messageService(): MessageService {
        return this._messageService;
    }

    user(): UserBean {
        return this._user;
    }

    // load the user
    private loadUser(_loginService: LoginService) {
        var _user: UserBean;
        var _self: any = this;
        _self._userLoaded = false;
        _self._loadService.startRequest();
        if (this._local) {
            var user: UserBean = _self._loginService.getLoginUser();
            this.onUserSucess(user);
        } else {
            _self._loginService.getLoginData().subscribe(_user => this.onUserSucess(_user));
        }
    }

    // load messages
    private loadMessages(_messageService: MessageService) {
        var _self: any = this;
        _self._messageLoaded = false;
        _self._loadService.startRequest();
        _messageService.initialize(window.navigator.language, function(correct: boolean, error: any = null) {
            _self._messageLoaded = true;
            _self._loadService.endRequest();
        });
    }

    // on user loaded
    onUserSucess(data: UserBean): void {
        this._userLoaded = true;
        this._loadService.endRequest();
        this._user = data;
    }
}

Answer 1

它没有加载默认选项，因为我有一个同步调用。我已将此调用更改为异步，现在它将加载默认选项。