如何在点击函数中同时获取 ID 和 Value答案

【问题标题】：How to Take both ID and Value in click function如何在点击函数中同时获取 ID 和 Value
【发布时间】：2022-01-20 07:35:48
【问题描述】：

从下拉列表中选择选项。我需要同时选择 Id 和 Value。我使用有角度的材料

select  (click)="selectChangeHandler($event)">
    <option value="Monday">Monday</option>
    <option value="Tuesday">Tuesday</option>
    <option value="1">Wednesday</option>
    <option value="Thursday">Thursday</option>
    <option value="Friday">Friday</option>
 </select>

【问题讨论】：

您的代码中没有 ID。
@Jayanthi 请添加可行且易于理解的代码。您的代码与您的问题不符。
我认为 Jayanthi 想了解选择下拉菜单的反应形式
为什么周三叫1，别人却有名字？
@jayanthi，你总是可以使用(click)="selectChangeHander($event,'myId',anotherVariable)。顺便说一句，如果你愿意，你可以在你的 .ts 中使用 select use `[(ngModel)]' 绑定一个变量（见docs 或reactive Forms

标签： node.js angular

【解决方案1】：

首先你已经放置了click事件而不是改变，接下来你可以很容易地捕获通过反应形式选择的值，我建议你使用反应形式会有所帮助，

您的 HTML 应该如下所示

<select [formControl]="selectDropDownValue">
  <option value="Monday">Monday</option>
  <option value="Tuesday">Tuesday</option>
  <option value="1">Wednesday</option>
  <option value="Thursday">Thursday</option>
    <option value="Friday">Friday</option>`enter code here`
</select>

现在将您的组件更改为如下所示，

import { Component, OnInit } from '@angular/core';
import { FormBuilder, FormControl } from '@angular/forms';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.scss']
})
export class AppComponent implements OnInit{
  title = 'stackoverflow-examples';
  
  selectDropDownValue: FormControl;

  constructor(private fb: FormBuilder) {
    this.selectDropDownValue = new FormControl('Monday');
  }

  ngOnInit() {
    this.selectDropDownValue.valueChanges.subscribe(
      chng => {
        console.log('The changed value is :', chng);
      }
    );
  }
}

本次更改后，您可以轻松捕获订阅中所有更改的值，

如果你想改变默认值，你只需要改变 .ts 文件中表单控件的值，你应该很好，试一试，让我知道你是怎么做的。 . ...

【讨论】：

如果这对您有帮助，请接受答案:)