Angular 8 routing component in new tab

Question

I have an Angular component callreports which I would like to open in a new tab thru click of a link button from main page. Currently it opens fine in same page but have to press back arrow on browser to navigate back. target='_blank' works in case of window.open with URLs but can't figure out in case of Component. Please advise if there's a way to open it in new tab in Angular 8

html

  <div class="col-md-6">
    <button class="m-1 btn btn-link" (click)="CallReports()" type="button">
      Call Flows
    </button>
  </div>

component

  public CallReports() {
    this._router.navigate(['callreports']);
  }

Answer 1

Update your CallReports to this:

  public CallReports() {
     const url = this._router.serializeUrl(
     this._router.createUrlTree(['/callreports']));

      window.open('#' + url, '_blank');
  }