如何使用来自angular 2组件的路由器打开新的浏览器选项卡？

Question

I have a angular 2 component and need to navigate to another route but in different browser tab. Below code is navigating in same browser tab.

    import { Component } from '@angular/core';
    import { Router } from '@angular/router';

    @Component({
         templateUrl: 'quotes-edit.component.html'
    })

    export class QuoteComponent {
         constructor(private router: Router) {
         }

         this.router.navigate(['quote/add']);
    }

Answer 1

Angular applications are SPA(Single Page Application), which means that the Router is nothing else than a Module to mimic the change of a Route which wouldn't be necessary. You can open redirect in another route in another tab like this

  /**
   * Open url in a new tab
   */
  navigateToNewTab(): void {
    // Here you can get the url
    const { protocol, host } = window.location;
    // Or use the router
    // this.router.url

    const path = '...';

    const url = `${protocol}//${host}/${path}`;
    window.open(url,'_blank');
  }

Answer 2

You wouldn't use the angular router for this but instead, you could make a function that has the following

 openinbrowserclicked(url) {
    window.open(
      'url',
      '_blank',
      'toolbar=no,resizable=yes,scrollbars=yes'
    );
  }