對(duì)于我的一個(gè)項(xiàng)目，我實(shí)現(xiàn)了一個(gè)具有自定義樣式的輸入范圍滑塊。當(dāng)組件初始化時(shí)，我想將最大價(jià)格設(shè)置為滑塊中的默認(rèn)值。我嘗試了幾種方法，但找不到解決方案。有人可以告訴我做錯(cuò)了什么嗎？這是我的實(shí)現(xiàn)的 stackblitz 演示
2 回答
侃侃無極
TA貢獻(xiàn)2051條經(jīng)驗(yàn) 獲得超10個(gè)贊
您需要為值創(chuàng)建一個(gè)輸入屬性并設(shè)置表單控件并將其綁定到輸入元素，就像這個(gè) 組件一樣
@Input() value:number; // default value
constructor(){
this.inputForm = new FormGroup({priceRangeSlider : new FormControl(null)});
}
ngOnInit() {
this.slider.valueChanges.subscribe(values =>{
this.priceForDisplay = values;
})
this.inputForm.get('priceRangeSlider').setValue(this.value); // init value set
}
模板
<div class="slider-container">
<input
class="slider"
type="range"
formControlName="priceRangeSlider"
[min]="minPrice"
[max]="maxPrice"
step="100"
[value]="value"
/>
</div>
應(yīng)用程序模板
<app-user [minPrice]="1000" [maxPrice]="10000" [value]="4000"><app-user>
DIEA
TA貢獻(xiàn)1820條經(jīng)驗(yàn) 獲得超2個(gè)贊
我編輯了您的代碼示例：https ://stackblitz.com/edit/create-a-basic-angular-component-amnhih
我將 FormControl 綁定到滑塊元素，并將初始setValue調(diào)用移至訂閱下方。
- 2 回答
- 0 關(guān)注
- 139 瀏覽
添加回答
舉報(bào)
0/150
提交
取消