Angular2模型綁定不起作用

我嘗試更新Angular 2中的輸入值，它在大小值第一次超過maxSize時工作，但後續工作不再工作。當我將這個.size設置爲某個值時，UI似乎沒有更新，我可以忽略一些東西嗎？Angular2模型綁定不起作用

HTML：

<input type="text" class="form-control" [value]="size" (input)="size = updateValue($event)">

代碼：

export class BrushSizePicker { 
@Input() minValue; 
@Input() maxValue; 
@Input() size; 

increaseValue(event) { 
this.size++; 

this.checkValue(); 
} 

decreaseValue(event) { 
this.size--; 

this.checkValue(); 
} 

updateValue(event) { 
this.size = parseInt(event.target.value); 
this.checkValue(); 

return this.size; 
} 

private checkValue() { 
if (this.size > this.maxValue) { 
    this.size = this.maxValue; 
} 
if (this.size < this.minValue) { 
    this.size = this.minValue; 
} 

}

編輯：我登錄了什麼事：校驗值時調用正確的輸入每一次，它會返回正確的值。但新值未設置到輸入字段/值字段中

來源

2016-01-09 jona jürgen

當'maxValue'和'minValue'沒有設置時'checkValue（）'做什麼？他們可能會重置爲null。 –

你可以在'updateValue'方法中加入一些斷點來查看它是否被調用，並查看'event.target.value'內的值。希望它可以幫助你... –

雖然它可能無法解決問題，但可以簡化實現輸入事件的方式。我會寫這樣的副作用免費功能：

updateValue(event) { // The method name with this change is a misnomer 
    return this.checkValue(parseInt(event.target.value)); 
} 

private checkValue(item) { 
if (item > this.maxValue) { 
    return this.maxValue; 
} 
else if (else < this.minValue) { 
    return this.maxValue; 
} 
return item; 
}

來源

2016-01-09 13:44:58 Chandermani

這永遠不會分配給'尺寸'。 –

這是'（input）=「size = updateValue（$ event）」' – Chandermani

對，我錯過了。 –

Angular2模型綁定不起作用

回答

相關問題