<commit_before># Analytics in Angular

### Listen to router events (& forward to Google Analytics (GA))
(after inserting the ga/gtag script into index.html)
```ts
declare var gtag: any;

export class AppCmp {
    constructor(router: Router) {
        const navEndEvents = router.events.pipe(filter(event => event instanceof NavigationEnd);
        navEndEvents.subscribe((event: Navigationend) => {
            gtag('config','UA-99336633-9', {
                'page_path': event.urlAfterRedirects
            });
        });
    }
}
```
### Listen to webpage-hash change with plain JS
(see also https://developer.matomo.org/guides/spa-tracking )<br>
(after configuring a new Tag in matomo incl. tracking type)<br>
(after inserting the matomo tag manager script into index.html)<br>
(use the Matomo preview mode (/?mtmPreviewMode={hash}) **or** the Matomo-Dashboard/Visitors/Visit-Log to see the sent infos)<br>

```js
window.addEventListener('hashchange', function() {
    _paq.push(['setCustomerUrl','/'+window.location.hash.substr(1)]);
    _paq.push(['setDocumentTitle', 'My New Title']);
    _paq.push(['trackPageView']);
});
```
<img src=mtmPreviewMode.png width="550px">
<commit_msg>ng analytics<commit_after># Analytics in Angular

## Listen to router events (& forward to Google Analytics (GA))
(after inserting the ga/gtag script into index.html)
```ts
declare var gtag: any;

export class AppCmp {
    constructor(router: Router) {
        const navEndEvents = router.events.pipe(filter(event => event instanceof NavigationEnd);
        navEndEvents.subscribe((event: Navigationend) => {
            gtag('config','UA-99336633-9', {
                'page_path': event.urlAfterRedirects
            });
        });
    }
}
```

## angulartics2 
> $ npm install angulartics2 --save         # docu: https://github.com/angulartics/angulartics2
### Features:
1. directives: angulartics2On, angularticsAction, angularticsCategory, angularticsLabel, angularticsValue, angularticsProperties
1. API:
    1. import { Angulartics2GoogleAnalytics } from 'angulartics2/ga';
    1. import { Angulartics2 } from 'angulartics2';
    1. import { Angulartics2RouterlessModule } from 'angulartics2/routerlessmodule';
    1. Angulartics2Module.forRoot({ pageTracking: { clearIds: true, excludedRoutes: [ ...
    1. angulartics2GoogleAnalytics.startTracking();
    1. this.angulartics2.eventTrack.next({  action: 'myAction', properties: {  category: 'myCategory', label: 'myLabel', }, });
1. supports all the main web analytics tools like GA or piwik (see https://github.com/angulartics/angulartics2#supported-providers )



## Listen to webpage-hash change with plain JS
(see also https://developer.matomo.org/guides/spa-tracking )<br>
(after configuring a new Tag in matomo incl. tracking type)<br>
(after inserting the matomo tag manager script into index.html)<br>
(use the Matomo preview mode (/?mtmPreviewMode={hash}) **or** the Matomo-Dashboard/Visitors/Visit-Log to see the sent infos)<br>

```js
window.addEventListener('hashchange', function() {
    _paq.push(['setCustomerUrl','/'+window.location.hash.substr(1)]);
    _paq.push(['setDocumentTitle', 'My New Title']);
    _paq.push(['trackPageView']);
});
```
<img src=mtmPreviewMode.png width="550px">

{'fraction_non_alphanumeric': 0.1374116200430372, 'fraction_numerical': 0.015063018751921304, 'mean_word_length': 4.223113964686998, 'pattern_counts': {'":': 0, '<': 13, '<?xml version=': 0, '>': 18, 'https://': 4, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '4480915', 'n_tokens_mistral': 1059, 'n_tokens_neox': 1002, 'n_words': 259}