README
Angular Yandex Metrika
Модуль добавляет на страницу счетчик(и) яндекс метрики, доступны все методы API метрики. Для методов, в которые можно передать колбэк, возвращается промис, но колбэки так же работают.
Версия 2 использует АПИ второй метрики.
npm install ng-yandex-metrika
yarn add ng-yandex-metrika
Чтобы подключить, нужно добавить скрипт в шаблон, либо подключить с помощью загрузчика модулей, и подключить в приложение.
import { MetrikaModule } from 'ng-yandex-metrika';
@NgModule({
imports: [
MetrikaModule.forRoot(
{ id: 35567075, webvisor: true }, // CounterConfig | CounterConfig[]
// Необязательный параметр по умолчанию первый попавшийся,
// Можно задать ид счетчика, либо порядковый номер в массиве.
defaultCounter, // number | string
),
]
})
Если вам нужно, чтобы счетчик работал без javascript, нужно добавить это:
<noscript><div><img src="https://mc.yandex.ru/watch/put_your_id_here" style="position:absolute; left:-9999px;" alt="" /></div></noscript>
Для отправки javascript события:
constructor(private metrika: Metrika) {}
onClick() {
this.metrika.fireEvent('some_event_name');
}
Просмотр страницы начнет трэкается автоматически для дефолтного счетчика (либо единственного), если импортировать куда-нибудь сервис.
Для отключения нужно задать параметр trackPageViews: false.
Для отправки данных о просмотре страницы вручную:
constructor(
private metrika: Metrika,
private router: Router,
) {
let prevPath = this.router.url;
this.router
.events
.filter(event => (event instanceof NavigationEnd))
.subscribe(() => {
const newPath = this.router.url;
if (newPath !== prevPath) {
this.metrika.hit(newPath, {
referer: prevPath,
});
prevPath = newPath;
}
});
}
Все настройки:
export interface CounterConfig {
id: string | number;
params?: any;
clickmap?: boolean;
trackLinks?: boolean;
accurateTrackBounce?: boolean;
trackPageViews?: boolean;
webvisor?: boolean;
trackHash?: boolean;
ut?: string;
ecommerce?: string;
triggerEvent?: boolean;
alternative?: boolean;
}