對于我的一個項目，我實現了一個具有自定義樣式的輸入范圍滑塊。當組件初始化時，我想將最大價格設置為滑塊中的默認值。我嘗試了幾種方法，但找不到解決方案。有人可以告訴我做錯了什么嗎？這是我的實現的 stackblitz 演示
2 回答
侃侃無極
TA貢獻2051條經驗 獲得超10個贊
您需要為值創建一個輸入屬性并設置表單控件并將其綁定到輸入元素，就像這個 組件一樣
@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>
應用程序模板
<app-user [minPrice]="1000" [maxPrice]="10000" [value]="4000"><app-user>
DIEA
TA貢獻1820條經驗 獲得超2個贊
我編輯了您的代碼示例：https ://stackblitz.com/edit/create-a-basic-angular-component-amnhih
我將 FormControl 綁定到滑塊元素，并將初始setValue調用移至訂閱下方。
- 2 回答
- 0 關注
- 140 瀏覽
添加回答
舉報
0/150
提交
取消