2016-01-28 21 views
19

मैं एक कोणीय 2 घटक लिख रहा हूं और इस समस्या का सामना कर रहा हूं।चयन विकल्प बदलने पर वर्तमान मूल्य प्राप्त करें - कोणीय 2

विवरण:(change) ईवेंट ट्रिगर होने पर मैं चयनकर्ता में अपने चयनकर्ता में विकल्प विकल्प को धक्का देना चाहता हूं।

इस तरह के नीचे टेम्पलेट के रूप में:

<select (change)="onItemChange(<!--something to push-->)"> 
    <option *ngFor="#value of values" value="{{value.key}}">{{value.value}}</option> 
</select> 

घटक वर्ग:

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 
    } 
} 

मैं कैसे मान (jQuery का उपयोग किए बिना) मिल सकता है?

उत्तर

30

विभिन्न विकल्पों से मूल्य प्राप्त करने का एक तरीका है। इस 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; 
    } 
3

चेकआउट इस काम कर Plunker

<select (change)="onItemChange($event.target.value)"> 
    <option *ngFor="#value of values" [value]="value.key">{{value.value}}</option> 
</select> 
+0

जवाब देने के लिए धन्यवाद, वास्तव में @ मुबाशीर का जवाब मैं डोम पढ़ने के बिना चाहता हूं। – Garry

+0

कोई समस्या नहीं है। चीयर्स! – micronyks

12

कोणीय 4 में, यह मेरे

के लिए काम किया

template.html

<select (change)="filterChanged($event.target.value)"> 
<option *ngFor="let type of filterTypes" [value]="type.value">{{type.display}} 
</option> 
</select> 

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() { 
    } 

    } 
2

मेरे लिए, गुजर ($ event.target.value) के रूप में @microniks ने सुझाव दिया काम नहीं किया। इसके बजाय क्या काम किया ($ event.value)। मैं कोणीय 4.2.x और कोणीय सामग्री का उपयोग कर रहा हूं 2

<select (change)="onItemChange($event.value)"> 
    <option *ngFor="#value of values" [value]="value.key"> 
     {{value.value}} 
    </option> 
</select> 
संबंधित मुद्दे