Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to open new browser tab using router from angular 2 component?

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']);
    }
like image 940
Nimesh Vaghasiya Avatar asked Dec 29 '16 12:12

Nimesh Vaghasiya


1 Answers

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');
  }


like image 152
Ling Vu Avatar answered Oct 13 '22 21:10

Ling Vu