Búsqueda de sitios web

typescript - angular mat-button enlace a URL externa


Angular 6 (https://angular.io/) nuevo proyecto, utilizando los Componentes de Material (https://material.angular.io/) ~ ¿Cómo puedo navegar a una URL externa desde un componente mat-button.

HTML

<button mat-button [matMenuTriggerFor]="menu">Menu</button>
<mat-menu #menu="matMenu">
  <button mat-menu-item>Item 1</button>
  <button mat-menu-item>Item 2</button>
</mat-menu>

Typescript

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

@Component({
  selector: 'menu-overview-example',
  templateUrl: 'menu-overview-example.html',
  styleUrls: ['menu-overview-example.css'],
})

 export class MenuOverviewExample {}

Editor en vivo: https://stackblitz.com/angular/maeymnkvlrq

Creo que me está faltando algo obvio como principiante, pero no puedo encontrar una respuesta a mi pregunta.

Respuesta #1

Puedes cambiar el atributo button a un a con el mismo diseño de un botón

<button mat-button [matMenuTriggerFor]="menu">Menu</button>
<mat-menu #menu="matMenu">
  <a href="http://www.google.com" mat-menu-item>Item 1</a>
  <button mat-menu-item>Item 2</button>
</mat-menu>

Respuesta #2

Usa algo como esto para un botón hacia una URL externa :

<a mat-raised-button href="https://stackoverflow.com/">Stackoverflow</a>

Artículos relacionados