Angular 2 RC5路由器指令RouterLink和RouterlinkActive配置

时间:2016-08-12 05:46:38

标签: angular angular2-routing

升级后,Angular 2 RC5中的链接出现问题。我能够全局使用routerLink(ROUTER_DIRECTIVES)

使用RC4,我有这个配置:

在maint.ts



import {ROUTER_DIRECTIVES} from "@angular/router";
import {PLATFORM_DIRECTIVES} from "@angular/core";

bootstrap(AppComponent, [
    
    { provide:PLATFORM_DIRECTIVES, useValue: [ROUTER_DIRECTIVES], multi: true}, // provide ROUTER_DIRECTIVES globally




现在,使用NgModule我想做类似的事情,以便全局使用routerlink和routerLinkActiveOptions。

以下是使用routerLinkActiveOptions加载页面时收到的错误消息:

EXCEPTION:错误:未捕获(在承诺中):模板解析错误: 无法绑定到“routerLinkActiveOptions”'因为它不是“a”的已知属性。 (">

编辑:

这是我的app.module.ts



/**
 * Created by MOMO on 10/08/2016.
 */
import { NgModule }                         from '@angular/core';
import { BrowserModule }                    from '@angular/platform-browser';
//import { HttpModule }                     from '@angular/http';

// Imports for loading & configuring the in-memory web api
import { HttpModule, XHRBackend }           from '@angular/http';
import {InMemoryBackendService, SEED_DATA}  from 'angular2-in-memory-web-api';
import { InMemoryDataService }              from './shared/in-memory-data.service';

// While Angular supplies a Title service for setting the HTML document title
// it doesn't include this service as part of the default Browser platform providers.
// As such, if we want to inject it into the components within our application,
// we have to explicitly provide the Angular service in our top component.
import { Title }                            from '@angular/platform-browser';

import { AppComponent }                     from './app.component';

import {PageNotFoundComponent}              from "./views/pageNotFound/page-not-found.component";

import { LoginComponent }                   from './auth/login/login.component';

import { DialogService }                    from './dialog.service';

import { SharedModule }                     from './shared/SharedModule';

import { routing, appRoutingProviders }     from './app.routing';

@NgModule({
    imports:      [
        BrowserModule,
        HttpModule,
        routing,
        SharedModule.forRoot()
    ],
    declarations: [
        AppComponent,
        LoginComponent,
        PageNotFoundComponent
    ],
    providers: [
        Title,
        appRoutingProviders,
        DialogService,

        // In-memory web api
        { provide: XHRBackend, useClass: InMemoryBackendService }, // in-mem server
        { provide: SEED_DATA,  useClass: InMemoryDataService }     // in-mem server data
    ],
    bootstrap:    [ AppComponent ]
})
export class AppModule { }




和路由文件:



/**
 * Created by MOMO on 24/07/2016.
 */
import { Routes, RouterModule }     from '@angular/router';

import {PageNotFoundComponent}      from "./views/pageNotFound/page-not-found.component";
import {LoginRoutes, authProviders} from "./auth/login.routing";

const IndexRoutes: Routes = [
    {
        path: '',
        loadChildren: 'app/index/index.module#IndexModule'
    }
];

const PostsRoutes: Routes = [
    {
        path: 'post',
        loadChildren: 'app/posts/posts.module#PostsModule'
    }
];

const AdminRoutes: Routes = [
    {
        path: 'admin',
        loadChildren: 'app/admin/admin.module#AdminModule'
    }
];

const AdminPostRoutes: Routes = [
    {
        path: 'admin/post',
        loadChildren: 'app/admin/posts/admin-posts.module#AdminPostsModule'
    }
];

const appRoutes: Routes = [

    ...IndexRoutes,
    ...PostsRoutes,
    ...LoginRoutes,
    ...AdminRoutes,
    ...AdminPostRoutes,
    { path: '**', component: PageNotFoundComponent }
];

export const appRoutingProviders: any[] = [
    authProviders
];

export const routing = RouterModule.forRoot(appRoutes);




0 个答案:

没有答案