EXCEPTION:在实例化路由器期间出错! (RouterOutlet - >路由器)

时间:2016-10-03 11:13:46

标签: angular typescript

您好我得到了上述异常。我正在使用angular2与打字稿。我是棱角分明的新手。我认为我的app.ts中有一些错误,因为它没有得到认可。但是我无法找到错误。将会给你提供帮助。谢谢

EXCEPTION: Error during instantiation of Router! (RouterOutlet -> Router).
angular2.dev.js:23501 EXCEPTION: Error during instantiation of Router! (RouterOutlet -> Router).BrowserDomAdapter.logError @ angular2.dev.js:23501BrowserDomAdapter.logGroup @ angular2.dev.js:23512ExceptionHandler.call @ angular2.dev.js:1185(anonymous function) @ angular2.dev.js:12489NgZone._notifyOnError @ angular2.dev.js:13533onError @ angular2.dev.js:13437Zone.run @ angular2-polyfills.js:1247(anonymous function) @ angular2.dev.js:13456zoneBoundFn @ angular2-polyfills.js:1220lib$es6$promise$$internal$$tryCatch @ angular2-polyfills.js:468lib$es6$promise$$internal$$invokeCallback @ angular2-polyfills.js:480lib$es6$promise$$internal$$publish @ angular2-polyfills.js:451(anonymous function) @ angular2-polyfills.js:123microtask @ angular2.dev.js:13488Zone.run @ angular2-polyfills.js:1243(anonymous function) @ angular2.dev.js:13456zoneBoundFn @ angular2-polyfills.js:1220lib$es6$promise$asap$$flush @ angular2-polyfills.js:262
angular2.dev.js:23501 ORIGINAL EXCEPTION: Route config should contain exactly one "component", "loader", or "redirectTo" property.BrowserDomAdapter.logError @ angular2.dev.js:23501ExceptionHandler.call @ angular2.dev.js:1194(anonymous function) @ angular2.dev.js:12489NgZone._notifyOnError @ angular2.dev.js:13533onError @ angular2.dev.js:13437Zone.run @ angular2-polyfills.js:1247(anonymous function) @ angular2.dev.js:13456zoneBoundFn @ angular2-polyfills.js:1220lib$es6$promise$$internal$$tryCatch @ angular2-polyfills.js:468lib$es6$promise$$internal$$invokeCallback @ angular2-polyfills.js:480lib$es6$promise$$internal$$publish @ angular2-polyfills.js:451(anonymous function) @ angular2-polyfills.js:123microtask @ angular2.dev.js:13488Zone.run @ angular2-polyfills.js:1243(anonymous function) @ angular2.dev.js:13456zoneBoundFn @ angular2-polyfills.js:1220lib$es6$promise$asap$$flush @ angular2-polyfills.js:262
angular2.dev.js:23501 ORIGINAL STACKTRACE:BrowserDomAdapter.logError @ angular2.dev.js:23501ExceptionHandler.call @ angular2.dev.js:1197(anonymous function) @ angular2.dev.js:12489NgZone._notifyOnError @ angular2.dev.js:13533onError @ angular2.dev.js:13437Zone.run @ angular2-polyfills.js:1247(anonymous function) @ angular2.dev.js:13456zoneBoundFn @ angular2-polyfills.js:1220lib$es6$promise$$internal$$tryCatch @ angular2-polyfills.js:468lib$es6$promise$$internal$$invokeCallback @ angular2-polyfills.js:480lib$es6$promise$$internal$$publish @ angular2-polyfills.js:451(anonymous function) @ angular2-polyfills.js:123microtask @ angular2.dev.js:13488Zone.run @ angular2-polyfills.js:1243(anonymous function) @ angular2.dev.js:13456zoneBoundFn @ angular2-polyfills.js:1220lib$es6$promise$asap$$flush @ angular2-polyfills.js:262
angular2.dev.js:23501 Error: Route config should contain exactly one "component", "loader", or "redirectTo" property.
    at new BaseException (https://code.angularjs.org/2.0.0-beta.8/angular2.dev.js:7385:21)
    at Object.normalizeRouteConfig (https://code.angularjs.org/2.0.0-beta.8/router.dev.js:1703:13)
    at RouteRegistry.config (https://code.angularjs.org/2.0.0-beta.8/router.dev.js:2301:41)
    at https://code.angularjs.org/2.0.0-beta.8/router.dev.js:2336:28
    at Array.forEach (native)
    at RouteRegistry.configFromComponent (https://code.angularjs.org/2.0.0-beta.8/router.dev.js:2335:23)
    at new RootRouter (https://code.angularjs.org/2.0.0-beta.8/router.dev.js:2979:21)
    at routerFactory (https://code.angularjs.org/2.0.0-beta.8/router.dev.js:1297:22)
    at Injector._instantiate (https://code.angularjs.org/2.0.0-beta.8/angular2.dev.js:11364:19)
    at Injector._instantiateProvider (https://code.angularjs.org/2.0.0-beta.8/angular2.dev.js:11294:21)BrowserDomAdapter.logError @ angular2.dev.js:23501ExceptionHandler.call @ angular2.dev.js:1198(anonymous function) @ angular2.dev.js:12489NgZone._notifyOnError @ angular2.dev.js:13533onError @ angular2.dev.js:13437Zone.run @ angular2-polyfills.js:1247(anonymous function) @ angular2.dev.js:13456zoneBoundFn @ angular2-polyfills.js:1220lib$es6$promise$$internal$$tryCatch @ angular2-polyfills.js:468lib$es6$promise$$internal$$invokeCallback @ angular2-polyfills.js:480lib$es6$promise$$internal$$publish @ angular2-polyfills.js:451(anonymous function) @ angular2-polyfills.js:123microtask @ angular2.dev.js:13488Zone.run @ angular2-polyfills.js:1243(anonymous function) @ angular2.dev.js:13456zoneBoundFn @ angular2-polyfills.js:1220lib$es6$promise$asap$$flush @ angular2-polyfills.js:262
angular2.dev.js:23501 ERROR CONTEXT:BrowserDomAdapter.logError @ angular2.dev.js:23501ExceptionHandler.call @ angular2.dev.js:1201(anonymous function) @ angular2.dev.js:12489NgZone._notifyOnError @ angular2.dev.js:13533onError @ angular2.dev.js:13437Zone.run @ angular2-polyfills.js:1247(anonymous function) @ angular2.dev.js:13456zoneBoundFn @ angular2-polyfills.js:1220lib$es6$promise$$internal$$tryCatch @ angular2-polyfills.js:468lib$es6$promise$$internal$$invokeCallback @ angular2-polyfills.js:480lib$es6$promise$$internal$$publish @ angular2-polyfills.js:451(anonymous function) @ angular2-polyfills.js:123microtask @ angular2.dev.js:13488Zone.run @ angular2-polyfills.js:1243(anonymous function) @ angular2.dev.js:13456zoneBoundFn @ angular2-polyfills.js:1220lib$es6$promise$asap$$flush @ angular2-polyfills.js:262
angular2.dev.js:23501 _Context {element: router-outlet, componentElement: root, injector: Injector}

app.ts

    //our root app component
import {Component} from 'angular2/core'
import {ROUTER_DIRECTIVES, RouteConfig, AsyncRoute} from 'angular2/router';
import {EventFormComponent} from './event-form.component';
import {GetBenefits} from './get-benefits.component';

@Component({
  selector: 'my-app',

  template: `
    <nav>
       <a class="button" [routerLink]="['./GetBenefits']">Get</a>
      <a class="button" [routerLink]="['./EventFormComponent']">Put</a>
    </nav>
    <router-outlet></router-outlet>,
directives: [ROUTER_DIRECTIVES],
 providers: [],
})

  @RouteConfig([

  {path: '/get', name: 'GetBenefits', component: GetBenefits},
  {path: '/put', name: 'EventFormComponent', component: EventFormComponent}



])
export class App {

}

自举

    //main entry point
import {bootstrap} from 'angular2/platform/browser';
import {RootComponent} from './root.component';
import {HTTP_PROVIDERS} from 'angular2/http';
import {ROUTER_PROVIDERS} from 'angular2/router';




bootstrap(RootComponent, [ROUTER_PROVIDERS,HTTP_PROVIDERS])
  .catch(err => console.error(err));

root.component.ts

import {Component, Inject} from 'angular2/core';
import {ROUTER_DIRECTIVES, RouteConfig} from 'angular2/router';
import {App} from './app';

@Component({

  selector: 'root',
  template: '<router-outlet></router-outlet>',
  directives: [ROUTER_DIRECTIVES],
  providers: [],

})


@RouteConfig([

  {path: '/', component: App, name:'App'},


])
export class RootComponent {
}

0 个答案:

没有答案