トラッキングコードをAngular 2に埋め込む

Question

Angular 2アプリにトラッキングコードを実装する最良の方法を探しています。 Googleアナリティクスではなく、Marketoやその他のサードパーティーのサプライヤです。私はコンポーネント（ページ）をロードするたびにコードを起動する必要があります。私はルータの変更を部分的な成功だけで（いくつかの予期しない結果）使ってみました。この種の一部のバージョンは機能していますが、完全ではありません。

this.router.events.subscribe(() => { 
    //tracking code goes here 
}); 

Angular2やその他のSPAでサードパーティのトラッキングを成功させた人は誰ですか？テンプレートファイルにタグを入れても機能しません。ありがとう。

Answer 1

追跡したいどの経路でもガードを使用してください。

import {CanActivate, ActivatedRouteSnapshot, RouterStateSnapshot} from "@angular/router"; 
import {Observable} from "rxjs"; 

export class TrackingGuard implements CanActivate 
{ 

    canActivate(route: ActivatedRouteSnapshot, 
       state: RouterStateSnapshot): Observable<boolean>|boolean 
    { 
     console.log(state.url); 
     console.log(state.queryParams); 
     return true; 
    } 

} 

そして、あなたはそれの下canActivate: [TrackingGuard]を追加するルートのどのコンポーネントを指定し、あなたのルート定義の中：それはルートがアクティブになるたびに呼び出されます。上記の例では、urlと任意のクエリパラメータにアクセスできます。追跡APIにリクエストを行い、ガードから電話するだけの他のサービスを作ることをお勧めします。