时间戳

首页 > 解决方案 > 自动选择单选按钮不触发路由

angular - 自动选择单选按钮不触发路由

问题描述

我正在用角度编写代码。我尝试在单选按钮中自动选择，但它没有触发点击事件。需要再次单击单选按钮以生成事件。这是我所做的

     <mat-radio-group aria-label="Select an option">

                    <mat-radio-button value="2" routerLink='/products/tshirt/shirt' [checked]='true'><span>Shirt</span></mat-radio-button><br>
                    <mat-radio-button value="3"><span>Cap</span></mat-radio-button>
                  </mat-radio-group>

我正在检查单选按钮，但路线不起作用。

标签： angularangular-material

解决方案

您不能为mat-radio-button. 但是您可以浏览单选按钮的更改事件：

<mat-radio-group aria-label="Select an option">
   <mat-radio-button value="2" (change)="changeRoute($event)"><span>Shirt</span></mat-radio-button>
   <mat-radio-button value="3" (change)="changeRoute($event)"><span>Cap</span></mat-radio-button>
</mat-radio-group>

在 ts 文件中，您可以根据所选值更改路线：

 private changeRoute(event:MatRadioChange){
    if(event.value === "2"){
      this.router.navigate(['/products/tshirts/shirt']);
    }
  }

在你的 ts 文件中不要忘记注入路由器：

constructor(private router: Router){}

推荐阅读