2016-01-09 14 views
7

私は公式ドキュメントからのサンプルコードを使用して、角度2ルータを使用して現在のルートを記録しようとしています実装するコンポーネントに対して呼び出されることはありません:https://angular.io/docs/ts/latest/api/router/OnActivate-interface.html角度2、routerOnActivate方法は、OnActivateイベント

import {Component} from 'angular2/core'; 
import { 
    OnActivate, 
    ComponentInstruction 
} from 'angular2/router'; 


@Component({selector: 'header-title', template: `<div>routerOnActivate: {{log}}</div>`}) 
export class HeaderTitle implements OnActivate { 
    log: string = ''; 

    routerOnActivate(next: ComponentInstruction, prev: ComponentInstruction) { 
     console.log('hello on activate'); 
     this.log = `Finished navigating from "${prev ? prev.urlPath : 'null'}" to "${next.urlPath}"`; 
    } 
} 

方法をrouterOnActivate決して呼ばれない。

私はRouteConfig注釈使用してルートを設定した:

@RouteConfig([ 
    {path: '/', component: Home, name: 'Index', data: {title: 'Index page'}}, 
    {path: '/home', component: Home, name: 'Home', data: {title: 'Welcome Home'}}, 
    {path: '/**', redirectTo: ['Index']} 
]) 

は私がリスナーを有効にするには、ルータに設定する必要がある何か他のものはありますか?

+0

ここでは 'implement'部分は重要ではありません。 'HeaderTitle'はルーティング経由で読み込まれますか?それ以外の場合は動作しません。 –

+0

@EricMartinezホームコンポーネント '{path: '/'、コンポーネント:ホーム、名前: 'Index'、データ:{title: 'Index page'}}'のようなルートでロードする必要があるということですか?現在、ホームコンポーネントのテンプレートに含まれているディレクティブ ' 'によってロードされています。 – geraldpereira

+0

はい、@ gpereiraです。 'implement'の部分は、あなたが入力を手助けするためのもので、IDEが不平を言うことはありません。あなたの 'Home'コンポーネントに' routerOnActivaite'を追加して、それがまったく呼び出されているかどうか確認してください。 –

答えて

12

パスを解決するコンポーネントの内部にrouterOnActivateメソッドを実装する必要があります。あなたの例では、ホームコンポーネントで実装すると呼び出されます。

関連する問題