Question

我正在尝试使用angular2跟随nativescript的快速入门演示。当我来到路由器时，它开始失败。错误消息：没有RouterOutletMap的提供程序！这是我的代码，

main.ts
#############
    import {nativeScriptBootstrap} from "nativescript-angular/application";
    import {ROUTER_DIRECTIVES,ROUTER_PROVIDERS} from '@angular/router-deprecated';
    import {NS_ROUTER_DIRECTIVES, NS_ROUTER_PROVIDERS} from "nativescript-angular/router";
    import {AppComponent} from "./app.component";

    nativeScriptBootstrap(AppComponent, [ROUTER_PROVIDERS]);

和

app.component.ts
    ############


     import {Component} from "@angular/core";
import {nativeScriptBootstrap} from "nativescript-angular/application";
import {RouteConfig, ROUTER_DIRECTIVES, ROUTER_PROVIDERS} from '@angular/router-deprecated';
import {NS_ROUTER_DIRECTIVES, NS_ROUTER_PROVIDERS} from "nativescript-angular/router";
import {FirstComponent} from "./first.component";
import {SecondComponent} from "./second.component";


@Component({
    selector: 'navigation-test',
    providers: [NS_ROUTER_PROVIDERS],
    directives: [NS_ROUTER_DIRECTIVES],
    template: `<page-router-outlet></page-router-outlet>`
})
@RouteConfig([
    { path: '/first', component: FirstComponent, name: 'First', useAsDefault: true },
    { path: '/second', component: SecondComponent, name: 'Second' },
])
export class AppComponent { }

Answer 1

作为nativescript github问题的解决方案here 您应该从NS_ROUTER_DIRECTIVES

导入NS_ROUTER_PROVIDERS，"nativescript-angular/router-deprecated/ns-router-deprecated" 像这样：

import {NS_ROUTER_DIRECTIVES, NS_ROUTER_PROVIDERS} from "nativescript-angular/router-deprecated/ns-router-deprecated";

以下我删除了不必要的导入和提供商......

<强> main.ts

import {nativeScriptBootstrap} from "nativescript-angular/application";
import {AppComponent} from "./app.component";

nativeScriptBootstrap(AppComponent);

app.component.ts

import {Component} from "@angular/core";
import {RouteConfig} from '@angular/router-deprecated';
import {NS_ROUTER_DIRECTIVES, NS_ROUTER_PROVIDERS} from "nativescript-angular/router-deprecated/ns-router-deprecated";
import {FirstComponent} from "./first.component";
import {SecondComponent} from "./second.component";

@Component({
   selector: 'navigation-test',
   directives: [NS_ROUTER_DIRECTIVES],
   providers: [NS_ROUTER_PROVIDERS],
   template: `<page-router-outlet></page-router-outlet>`
})
@RouteConfig([
   { path: '/first', component: FirstComponent, name: 'First',      useAsDefault: true },
   { path: '/second', component: SecondComponent, name: 'Second' },
  ])
 export class AppComponent { }

Nativescript Angular2路由提供程序

1 个答案: