Google Analytics（分析）视图选择器不适用于Angle 5应用程序

Question

我正在尝试在我的angular 2应用程序中实现google Analytics DataChart查看器。我已添加

(function(i, s, o, g, r, a, m) {
  i['GoogleAnalyticsObject'] = r;
  i[r] = i[r] || function() {
    (i[r].q = i[r].q || []).push(arguments)
  }, i[r].l = 1 * new Date();
  a = s.createElement(o),
    m = s.getElementsByTagName(o)[0];
  a.async = 1;
  a.src = g;
  m.parentNode.insertBefore(a, m)
})(window, document, 'script', 'https://www.google-analytics.com/analytics.js', 'ga');
ga('create', 'UA-122218479-1', 'auto'); // add your tracking ID here.
ga('set', 'page', '/#/admin/google-analytics');
ga('send', 'pageview');

在index.html页面中

ngAfterViewInit() {
  gapi.analytics.ready(function() {
    const CLIENT_ID = '--secrete id ---';
    gapi.analytics.auth.authorize({
      container: 'auth-button',
      clientid: CLIENT_ID,
    }, function(res) {});

    // Step 4: Create the view selector.

    const viewSelector = new gapi.analytics.ViewSelector({
      container: 'view-selector'
    });

    // Step 5: Create the timeline chart.

    const timeline = new gapi.analytics.googleCharts.DataChart({
      reportType: 'ga',
      query: {
        'dimensions': 'ga:date',
        'metrics': 'ga:sessions',
        'start-date': '30daysAgo',
        'end-date': 'yesterday',
      },
      chart: {
        type: 'LINE',
        container: 'timeline',
        options: {
          width: '100%'
        }
      }
    });

    // Step 6: Hook up the components to work together.

    gapi.analytics.auth.on('success', function(response) {
      viewSelector.execute();
    });

    viewSelector.on('change', function(ids) {
      const newIds = {
        query: {
          ids: ids
        }
      };
      timeline.set(newIds).execute();
    });
  });
}

在我的组件中，我在

中添加了以下代码

在组件HTML中-

  <section id="auth-button"></section>
  <section id="view-selector"></section>
  <section id="timeline"></section>

当我重新加载页面时它正在工作，但是当我更改路线时它却不工作。我没有任何错误。