首页 > 解决方案 > 按钮的发送值不起作用 [Angular Material Bootstrap]

问题描述

嘿,我尝试将按钮的值发送到这样的函数

<button #mybtn value="somthing" (click)="filterTable(mybtn.value)" mat-stroked-button>mybtn</button>

在我的 ts 组件中:

  filterTable(filterValue) {
    console.log(filterValue);
  }

它安慰 Undefiend

但是当我像这样在没有 Bootstrap 的情况下制作按钮时

<button #mybtn value="Somthing" (click)="filterTable(mybtn.value)">mytn</button>

这种方式是控制台“Somthing”并且可以工作。为什么???

标签: angularangular-material

解决方案


您需要访问本机元素以获取值。将此添加到您的 .ts 文件中

import { Component, ElementRef, ViewChild } from '@angular/core';
...
export class SomeComponent {
@ViewChild('mybtn', {static: false}) mybtn: ElementRef;
...
public filterTable() {
   console.log(this.mybtn.nativeElement.value)
}

从您的方法中省略参数,logButton使其变得只是

(click)="filterTable()"

推荐阅读