Jak uzyskać liczbę w [(ngModel)] w Angular 2?

Question

Jak uzyskać liczbę w [(ngModel)] w Angular 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"} 
]; 

Próbowałem dodać type="number" w różnych miejscach.

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

i

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

Ale kiedy wybrać nową pozycję, levelNum wciąż staje się łańcuch.

Answer 1

Opcja z * ngFor w Angular2 wydaje się nie działać poprawnie podczas używania obiektów. Zostało otwarte w numerze github, ale nadal nie zostało rozwiązane.

Dopóki to nie zostanie naprawione, zrobię coś w rodzaju zmiany wartości ciągu na liczbę za każdym razem, gdy zmieni się wartość wyboru.

@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); 
    } 
} 

Answer 2

myślę Najprostszym rozwiązaniem byłoby oddać go do numeru, kiedy trzeba go użyć ... Proste +this.levelNum zrobi. http://plnkr.co/edit/SxQfNlUB4RNdo2OndM9o