ค้นหาเว็บไซต์

typescript - ปุ่ม mat-button ของ Angular ลิงก์ไปยัง URL ภายนอก


Angular 6 (https://angular.io/) โปรเจกต์ใหม่ ใช้ Material Components (https://material.angular.io/) ~ ฉันจะนำทางไปยัง URL ภายนอกจากคอมโพเนนต์ 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>

ไทป์สคริปต์

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

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

 export class MenuOverviewExample {}

โปรแกรมแก้ไขสด: https://stackblitz.com/angular/maeymnkvlrq

ฉันเชื่อว่าฉันกำลังพลาดบางสิ่งที่ชัดเจนในฐานะมือใหม่ แต่ไม่สามารถหาคำตอบสำหรับคำถามของฉันได้

คำตอบ #1

คุณสามารถเปลี่ยนแอตทริบิวต์ button เป็น a พร้อมกับดีไซน์เดียวกันกับปุ่มได้

<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>

คำตอบ #2

ใช้สิ่งประมาณนี้สำหรับปุ่มไปยัง URL ภายนอก:

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

บทความที่เกี่ยวข้อง