CanDeactivateガードは、ガードしているコンポーネントの機能へのアクセスがありません

Question

Ang2でCanActivateガードを使用して変更を保存するように頼んでいます。 私は角RC4を使用しています

Boot.ts

bootstrap(App, [ 
...HTTP_PROVIDERS, 
StorageService, 
PortfolioNavigationGuard, 
other... 

Routes.ts

export const PortfolioRoutes: RouterConfig = [ 
{ path: 'portfolios', component: 'PortfolioListComponent' }, 
{ path: 'portfolios/:id', component: 'PortfolioModelComponent', canDeactivate: [PortfolioNavigationGuard] }, 
{ path: 'portfolios/:id/:action', component: 'PortfolioModelComponent', canDeactivate: [PortfolioNavigationGuard] } 

ガード

@Injectable() 

export class PortfolioNavigationGuard implements CanDeactivate<PortfolioDetailComponent> {

constructor(private router: Router) { } 

canDeactivate(component: PortfolioDetailComponent) { 

    component.canDeactivate(); 
    component.anyfunction() --- anyfunction is not a function 

    return true; 
} 

エラー

EXCEPTION: Error: Uncaught (in promise): TypeError: component.canDeactivate is not a function 

コンポーネント

export class PortfolioDetailComponent { 
canDeactivate() { 
    console.log("WOW"); 
} 

は、なぜ私は私のガード内部のコンポーネント上の任意の関数を呼び出すことはできませんか？

Answer 1

私はいくつかの変更行った：

が異なる成分（Iルートの設定で定義されたものと同じ）にガード実装を交換：あり

export class PortfolioNavigationGuard implements CanDeactivate<PortfolioModelComponent> { 

に

export class PortfolioNavigationGuard implements CanDeactivate<PortfolioDetailComponent> { 

を注意すべき2つのこと。最初のコンポーネントはルータのコンセントからロードされず、2番目のコンポーネントはルータのコンセントからロードされません。私は別のもの（テンプレートのタグとして使用されている）に属しているコンポーネントがルートデータにアクセスできると考えていました（しかし、ルータのコンセントではなくセレクタを使ってもたらされたコンポーネントではルートIDの変更をサブスクライブできます）。ガードのために、あなたがガードを置いているコンポーネントはルータのアウトレットに持って来なければなりません。