Код для вставки треков в Angular 2

Question

Я ищу лучший способ реализовать коды отслеживания в моем приложении Angular 2. Не Google Analytics, а сторонние поставщики, такие как 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 и просто звонит, если от охранника.