Google Analytics in Angular2 without page URL change?

Question

Can someone please tell me how can I use Google Analytics when page URL is not change. I am using Angular Material md-tab-group which just switch the page without changing the URL.

Example Code snippet:

<md-tab-group [selectedIndex]="selectedIndex" #navigationTabs (selectChange)="indexChanged(navigationTabs);">
  <md-tab label="Label1" [class.mat-tab-label-active]="selectedIndex === 0" >
     <label1-scores *ngIf="selectedIndex === 0"></label1-scores>
  </md-tab>
  <md-tab label="Label2" [class.mat-tab-label-active]="selectedIndex === 1">
    <label2-groups *ngIf="selectedIndex === 1"></label2-groups>
  </md-tab>
</md-tab-group>

protected indexChanged(i) {
    if (i == 0) {
      ga('send', 'pageview', "/scores");
    }
    else if (i == 1) {
      ga('send', 'pageview', "/groups");
    }
}

In these cases page URL is static, only angular2 component is changing. Is this a correct way to send page data to google or any other way is possible?

Answer 1

Try this:

protected indexChanged(i) {
    if (i == 0) {
      ga('set', 'page', "/scores");
    }
    else if (i == 1) {
      ga('set', 'page', "/groups");
    }
    ga('send', 'pageview');
}