p-tabMenu werfen "Kein Provider für Router!" Ausnahme

Guten Tag. Ich möchte ein einfaches Tabmenu wie im Tutorial von Primeng erstellen, ich möchte es nur anzeigen. Aber ich bekomme "Kein Provider für Router!" Ausnahme. Diese wir Komponente mit tabmenu:p-tabMenu werfen "Kein Provider für Router!" Ausnahme

<div class="ui-g"> 
    <h1>Heeey!</h1> 
    <p-tabMenu ([ngModel])="menuItems"></p-tabMenu> 
</div> 


@Component({ 
    selector: 'test', 
    templateUrl: './Views/test.html', 
    directives: [ROUTER_DIRECTIVES, DataScroller, DataGrid, Panel, TabMenu], 
    styleUrls: ['../../Styles/EntranceStyle.css'], 
    providers: [Http, HTTP_PROVIDERS] 
}) 

export class TestComponent implements OnInit { 
    public _tests: TestModel[] = new Array<TestModel>(); 
    public products: TestModel[] = new Array<TestModel>(); 

    private menuItems: MenuItem[]; 

    ngOnInit() { 

     this.menuItems = [ 
      { label: 'Coffee'}, 
      { label: 'Sweets'}, 
      { label: 'Salads'}, 
     ]; 
    } 
}

Ich erklärte ROUTER_PROVIDERS in boot: bootstrap(AppComponent, [ROUTER_PROVIDERS, HTTP_PROVIDERS, AUTH_PROVIDERS, provide(LocationStrategy, {useClass: HashLocationStrategy})]);

Quelle

2016-07-05 Amelina

Welche Version von Angular2 verwenden Sie? In den letzten Versionen gab es einige Änderungen in Bezug auf Routing ... –

@ThierryTemplier Version ist 2.0.0-rc.1 – Amelina

Zuerst sollten Sie aktualisieren (beiden Projekte befinden sich noch in der Entwicklung und Router wurde in letzter Zeit geändert und erweitert) auf dem neuesten primeng und die entsprechende unterstützte angular2 Version auf das Datum; Das bedeutet: primeng-beta9 und angular2-rc3 (Juli/2016).

Dann müssen Sie app.routes.ts ein RouterConfig, in-Datei erstellen:

export const routes: RouterConfig = [ 
    {path: '/', component: MyComponent} 
] 

export const APP_ROUTER_PROVIDERS = [ 
    provideRouter(routes) 
];

Und dann füge sie die boot.ts:

bootstrap(AppComponent, [ 
    APP_ROUTER_PROVIDERS, 
    disableDeprecatedForms(), 
    provideForms(), 
    provide(LocationStrategy, {useClass: HashLocationStrategy}) 
]);

In dem AppComponent müssen Sie die Router-Richtlinien angeben:

@Component({ 
    selector: 'my-selector', 
    templateUrl: 'my.html', 
    directives: [ROUTER_DIRECTIVES] 
}) 
export class AppComponent { 
//... blahblahblah 
}

Denken Sie daran, die <base href="/"> in <head> hinzuzufügen.

Quelle: https://angular.io/docs/ts/latest/guide/router.html

Quelle

2016-07-06 15:18:24 Sergio

Gute Antwort! Eine Sache, Sie können die "" hinzufügen oder Sie können "addieren (APP_BASE_HREF, {useValue: '/'})" zum Bootstrap hinzufügen. Seien Sie auch vorsichtig beim Aktualisieren der Bibliotheken, lesen Sie die Dokumentation und prüfen Sie, ob Ihr Projekt dadurch beschädigt wird. Ich werde hier eine Demo verlassen http://plnkr.co/edit/zQ43rV?p=preview :) –

p-tabMenu werfen "Kein Provider für Router!" Ausnahme

Antwort

Verwandte Themen