Get current value when change select option - Angular2

Question

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   lt select  change   quot onItemChange  lt  --something to push-- gt   quot  gt       lt option  ngFor  quot  value of values quot  value  quot   value key   quot  gt   value value   lt  option gt   lt  select gt   Component Class   export Class Demo     private values                    key  quot key1 quot           value  quot value1 quot                         key  quot key2 quot           value  quot value2 quot                constructor       onItemChange anyThing any        console log anyThing     Here I want the changed value        How can I get the value without using jquery

User · Answer

For me  passing   event target value  as suggested by  microniks did not work  What worked was   event value  instead  I am using Angular 4 2 x and Angular Material 2   lt select  change   onItemChange  event value   gt       lt option  ngFor   value of values   value   value key  gt           value value        lt  option gt   lt  select gt

User · Answer

You can Use ngValue  ngValue passes sting and object both   Pass as Object    lt select  change   onItemChange  event value   gt       lt option  ngFor   obj of arr   ngValue   obj value  gt           obj value        lt  option gt   lt  select gt    Pass as String    lt select  change   onItemChange  event value   gt       lt option  ngFor   obj of arr   ngValue   obj  gt           obj value        lt  option gt   lt  select gt

User · Answer

There is a way to get the value from different options  check this plunker component html  lt select class  quot form-control quot   t  change   quot callType t value  quot  gt     lt option  ngFor  quot  type of types quot   value   quot type quot  gt   type   lt  option gt   lt  select gt   component ts  this types      type1    type2    type3      callType value      console log value     this order type   value

User · Answer

Template     lt select class  randomClass  id  randomId   change      filterSelected  event target value   gt    lt option  ngFor    let type of filterTypes   value   type value  gt   type display     lt  option gt    lt  select gt    Component    public filterTypes        value    New   display    Open         value    Closed   display    Closed       filterSelected selectedValue string     console log  selected value    selectedValue

User · Answer

Checkout this working Plunker   lt select  change   onItemChange  event target value   gt       lt option  ngFor   value of values   value   value key  gt   value value   lt  option gt   lt  select gt

User · Answer

In angular 4  this worked for me template html  lt select  change   quot filterChanged  event target value  quot  gt     lt option  ngFor  quot let type of filterTypes quot   value   quot type value quot  gt   type display      lt  option gt   lt  select gt   component ts  export class FilterComponent implements OnInit    selectedFilter string     public filterTypes            value   percentage   display   percentage            value   amount   display   amount             constructor           this selectedFilter    percentage            filterChanged selectedValue string        console log  value is    selectedValue           ngOnInit

[html] Get current value when change select option - Angular2

Examples related to html

Examples related to angular