2017-12-27 7 views
3

現在、小さな角度のプロジェクトで作業中で、入力イベントに問題があります。ngModelバインディングで角度入力イベントがトリガーされていません

<select (change)="onSelect($event.target.value)" > 
    <option *ngFor="let option of options" [value]="option.id">{{option.name}}</option> 
</select> 

これは正常に動作してもされています

は、私は次のコードを持っています。しかし、私はそれを次のように変更したいと考えました:

<select (change)="onSelect($event.target.value)" [(ngModel)]="selectedItem"> 
    <option *ngFor="let option of options" [value]="option.id">{{option.name}}</option> 
</select> 

これ以降、変更イベントはもう発生しません。私も[ngModel]と(ngModelChange)ともっとたくさん試しました。しかし、ngModelとバインドされているものがある限り、イベントはそれ以上トリガーされません。

すべての私の角度のものは、バージョン5.1.2でその動作を角度を持っている理由は、誰もが知ってい

1.6.2でのCLIのですか? ご挨拶ありがとうございます。

+0

私はこの質問のためのコールに参加します、問題は私が(anuglar ng buildを使用して)AOTコンパイルでngModelを使用していました。イベントの変更を受け取ることを拒否します。 – Ayyash

答えて

0

あなたはngModel

<select (ngModelChange)="onSelect($event.target.value)" [(ngModel)]="selectedItem"> 
    <option *ngFor="let option of options" [value]="option.id">{{option.name}}</option> 
</select> 
+0

だから、私も書いた_Iも試みた...(ngModelChange)_ !!! – nic

+0

上記の[(ngModel)] – Sajeetharan

+0

で試してみてください。私はそれらのすべての可能な組み合わせを試しました。 – nic

1

を使用して値をバインドしているとき、それは次のように仕事ができるngModelChangeを使用する必要があります。ここでは

<select type="number" [(ngModel)]="selectedItem" > 
    <option *ngFor="let option of options" [ngValue]="option.id">{{option.name}}</option> 
</select> 

plnkrが、それはあなたの問題の仲間の解決を願って取り組んでいます。 )

+0

ありがとうございます。しかし、私はまだonChangeトリガーを持っていたいです。 – nic

+0

あなたはまだ、plnkrを更新することができました...もう一度チェックしてください。 –

+0

しかし、私のプロジェクトではうまくいきません。 [(ngModel)]と(ngModelChange)はどうにかして動作しません。 – nic

0

この試してみてください。component.tsで

<select type="number" [(ngModel)]="selectedItem" > 
    <option *ngFor="let option of options" (click)=“selectedItem(option)” [ngValue]="option.id">{{option.name}}</option> 
</select> 

を -

optionSelected: any; 
selectedItem(option: any) { 
if (option) { 
this.optionSelected = option; 
} else { 
this.optionSelected = ‘’; 
} 
} 

次に、あなたがあなたのニーズに応じてthis.optionSelected使用することができます。..

関連する問題