2016-11-04 15 views
1

私は時間入力に自分の番号プロパティをバインドする方法を探しています。 私のモデルプロパティはタイプ番号でなければならないので、これを実行したいと思います。私は時間の値をバインディングで秒に変換したいと思います。 私はこのコードを試してみました:Angular2の入力番号へのバインド番号

<input type="time" step="1" [ngModel]="value.value | timeToNumber" (ngModelChange)="value.value = $event"> 

マイtimeToNumberパイプの変換文字列 "HH:MM:SS" 秒にします。しかし、入力は数値型を受け入れることができないため、機能しません。 どうすればそれを行うことができますか?

答えて

0

入力の要素が変更された後に ngModelChangeを呼び出す無限ループの種類が原因で、ngModelChangeが再び呼び出されるパイプtimeToNumberが呼び出されるため、この方法ではできないと思います。

などの変数を1つ保存することで解決できます。たとえば、 "value.value"のパイプバージョン値を保持する "value.valueForm"です。例えば

  <input type="time" step="1" placeholder="time in seconds.." name="myTime" #iTime #myTime="ngModel" 
        [ngModel]="value.valueForm" 
        (ngModelChange)="value.valueForm=onChange($event, iTime)" /> 


onChangeCash(eventStr: string, eRef): string { 
    var res = this.getNumberOnChange(eventStr, eRef); // gets current value of element using eRef. Pipe it and return new piped value as res. 
    this.value.value = this.getNumberOfStr(res); // gets new piped value as res and convert it to Model value you need to save. 
    return res; 
} 

getNumberOnChange()、getNumberOfStr()の一例を持っていないため申し訳ありません。