角2子コンポーネントをインスタンス化する前にルートコンポーネントを解決する

Question

Webアプリケーションを更新するとき、コンポーネントまたはルートをインスタンス化する前に、サインインされたユーザーのデータを要求する必要があります。 ユーザーのデータが見つかった場合、私はそれを他のすべてのサブコンポーネントが依存するサービスに注入したいと考えています。

シナリオ：App（ROOT）、ホームの3つのコンポーネントがあるとします。&について。 このコードをAboutコンポーネントに配置すると、インスタンス化する前に20秒待つ代わりに、コンポーネントが即座にインスタンシエートされます。このコンポーネントから離れると、関数がトリガされ、ホームに到達するまでに20秒待ちます。 。

routerOnActivate(next: ComponentInstruction, prev: ComponentInstruction) { 
    return new Promise((res, rej) => { 
     setTimeout(function() { 
      res(true); 
     }, 20000) 
    }) 
} 

私もどんなルートをインスタンス化する前に、理想的には私は私がリクエストルートコンポーネントで解決をしたい、解決が任意の経路に接続する必要はありません。

Answer 1

実際には2つの方法があります。

1）エクステントRouter-Outletクラスのいずれかで、アクティブなコンポーネントごとに20秒間待つことができ、singedInユーザーのデータを扱うことができます（どちらも単一ファイルまたは単一の場所で処理できます）。

2）または個々のコンポーネントで@CanActivateフックを使用して20秒待つことができます。コンポーネントがアクティブになると、おそらくユーザー情報オブジェクトを含むshareServiceをコンストラクタに挿入して、さらに処理を実行できます。

これは、コンポーネントで@CanActivateを使用し、開始する前に20秒待つことができます。

私は私のまわり成分にこのコードを配置した場合、私は

@CanActivate((next: ComponentInstruction, previous: ComponentInstruction) => { 
    return new Promise((res, rej) => { 
     setTimeout(function() { 
      res(true); 
     }, 20000) 
    }) 
})