2016-02-18 20 views
6

[(ngModel)]の数値を角2で取得する方法は?[(ngModel)]の数値を角2で取得する方法は?

<select [(ngModel)]="levelNum"> 
    <option *ngFor="#level of levels" [value]="level.num">{{level.name}}</option> 
</select> 

levelNum:number; 
levels:Array<Object> = [ 
    {num: 0, name: "AA"}, 
    {num: 1, name: "BB"} 
]; 

別の場所にを追加しようとしました。

<select type="number" [(ngModel)]="levelNum"> 
    <option *ngFor="#level of levels" [value]="level.num">{{level.name}}</option> 
</select> 

<select [(ngModel)]="levelNum"> 
    <option type="number" *ngFor="#level of levels" [value]="level.num">{{level.name}}</option> 
</select> 

しかし、私は新しい項目を選択すると、levelNumはまだ文字列になります。

+1

インターフェイスを定義し、numの代わりにobjectを使用するとどうなりますか? –

+0

@DavidL私は実際には 'インターフェイスレベル{num:number、name:string}'を持っていますが、まだ同じです –

+0

@HongboMiaoはここに同じです[SO質問](http://stackoverflow.com/q/33181936/2435473)役に立たない答えで –

答えて

7

とAngular2の* ngForを選択しても、オブジェクトを使用すると正しく動作しないようです。彼らはgithubに問題をオープンしましたが、まだ解決されていません。

これまでは、選択値が変更されたときに文字列値を数値に変更するなどの作業を行いました。

@Component({ 
    selector: 'my-app', 
    template:` 
    <h1>Selecting Number</h1> 
    <select type="number" [(ngModel)]="levelNum" (ngModelChange)="toNumber()"> 
     <option *ngFor="#level of levels" [value]="level.num">{{level.name}}</option> 
    </select> 
    {{levelNum}} 
    `, 
}) 
export class AppComponent { 
    levelNum:number; 
    levels:Array<Object> = [ 
     {num: 0, name: "AA"}, 
     {num: 1, name: "BB"} 
    ]; 

    toNumber(){ 
    this.levelNum = +this.levelNum; 
    console.log(this.levelNum); 
    } 
} 
+0

ありがとう、素敵なトリック! –

+0

配列の場合は、this.list = this.list.map(Number); – Rookian

1

私は、最も簡単な解決策は、あなたがそれを使用する必要があるとき数にキャストすることです...シンプル+this.levelNumがどうなると思います。 http://plnkr.co/edit/SxQfNlUB4RNdo2OndM9o

関連する問題