更改选择选项时获取当前值 - Angular2 [英] Get current value when change select option - Angular2

问题描述

$ b

描述：我想在选择器中推送一个选项值当它的处理程序触发（change）事件时。

如下面的模板：

 < select（change）=onItemChange（<！ -  something to push  - >）> 
< option * ngFor =＃value of valuesvalue ={{value.key}}> {{value.value}}< / option> 
< / select> 
  

组件类：

  export Class Demo {
 
 private values = [
 {
 key：key1，
 value：value1
 }，
 {
 key：key2，
 value：value2
} 
] 
 
构造函数（）{} 
 onItemChange（anyThing：any）{
 console.log（anyThing）; //这里我想要改变后的值
 
 
 code $ $ $ $ $ $ $ 
 $ b 
获取值（不使用jquery）？
 
解决方案
有一种方法可以从不同的选项中获取值。请检查此 plunker  
 
 
 
组件.html  
 
 
 < select class =form-control#t（change）=callType（t.value） > 
< option * ngFor =＃type of types[value] =type> {{type}}< / option> 
< / select> 
  
 component.ts 
  this.types = ['type1'，'type2'，'type3']; 
 this.order = {
 type：'type1'
}; 
 
 callType（value）{
 console.log（value）; 
 this.order.type = value; 
} 
  
 
I'm writing an angular2 component and am facing this problem.


Description: I want to push an option value in select selector to its handler when the (change) event is triggered.

Such as the below template:
<select (change)="onItemChange(<!--something to push-->)">
    <option *ngFor="#value of values" value="{{value.key}}">{{value.value}}</option>
</select>
Component Class:
export Class Demo{

  private values = [
     {
        key:"key1",
        value:"value1"
     },
     {
        key:"key2",
        value:"value2"
     }
  ]

  constructor(){}
  onItemChange(anyThing:any){
     console.log(anyThing); //Here I want the changed value
  }
}
How can I get the value(without using jquery) ?
解决方案
There is a way to get the value from different options. check this plunker

component.html
 <select class="form-control" #t (change)="callType(t.value)">
  <option *ngFor="#type of types" [value]="type">{{type}}</option>
</select>
component.ts
    this.types = [ 'type1', 'type2', 'type3' ];
   this.order = {
      type: 'type1'          
  };  

  callType(value){
    console.log(value);
    this.order.type=value;
  }


                        
这篇关于更改选择选项时获取当前值 -  Angular2的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！