Cómo abrir otra pestaña en Angular?

Tengo un problema que no sé como solucionarlo, cuando presiono sobre una referencia, quiero que me lleve al detalle de esta, pero actualmente lo hace en la pestaña actual, como puedo hacer que el componente de detalle se obra en otra?

En el código tengo esto:
Route:

path: 'evento/:id',
component: EventoDetalleComponent,
canActivate: [AuthService],
canActivateChild: [AuthService],
  },

Servicio de navegación:

goToEventoDetail(id: number, nombre:string){
   this.router.navigate(['./evento', nombre +'/'+ id])
 }

Aquí lo llamo:

 <button
              type="button"
              pButton
              (click)="verDetalle(evento)"
              mat-icon-button
              matTooltip="Ver más sobre este evento"
            >
              <mat-icon class="fa fa-pencil">search</mat-icon>
            </button>

<a target="_blank" rel="noopener noreferrer" [href]="'https://miapp.com/detalle'">Link</a>

<a (click)="abrirLink("www.miapp.com/detalle")">Detalle</a>

abrirLink(url: string){
    window.open(url, "_blank");
}