How to scroll to a fragment in Angular.io (scroll to anchor)

scrollToAnchorExample.ts

import { Component, OnInit } from '@angular/core';
import { OnDestroy } from '@angular/core';
import { Router, NavigationEnd } from '@angular/router';
import { Subscription } from 'rxjs/Rx';

@Component({
  selector: 'scroll-to-anchor-example',
  template: `<a type="button" md-button class="button" routerLink="/this-view-url" 
  fragment="test-fragment" routerLinkActive="active">Go to test fragment</a>
  <p>Blah blah blah ...</p>
  ...
  <h2 id="test-fragment">Test Fragment</h2>
  <p>blah blah blah ...</p>`,
  styleUrls: ['./scroll-to-anchor-example.component.css']
})
export class UsageComponent implements OnInit {

  private scrollSubscription: Subscription;

  constructor(private router: Router) {
    this.scrollSubscription = router.events.subscribe(s => {
      if (s instanceof NavigationEnd) {
        const tree = router.parseUrl(router.url);
        if (tree.fragment) {
          const element = document.querySelector('#' + tree.fragment);
          if (element) { element.scrollIntoView(true); }
        }
      }
    })

  }

  ngOnInit() {
  }

  public ngOnDestroy() {
    this.scrollSubscription.unsubscribe();
  }

}