如果它是响应式表单的表单控件，则在滑动垫滑块时更新表单数据答案

【问题标题】：Update form data while sliding mat slider if it's a form control of a reactive form如果它是响应式表单的表单控件，则在滑动垫滑块时更新表单数据
【发布时间】：2018-08-30 11:02:09
【问题描述】：

我有一个滑块，它是响应式表单的表单控件。我希望在滑动滑块时更新表单数据。

现在，当我释放滑块时，数据会更新。

我也许可以用这个解决我的问题 Get angular2 md-slider value while sliding 但我觉得这不是最好的答案，因为表单数据将更新两次。（在幻灯片上，以及当用户释放滑块时）而且我觉得如果我必须手动更新场景背后的数据，它就违背了拥有反应式表单的目的。

【问题讨论】：

标签： angular angular-material

【解决方案1】：

试试这个，它对我有用。在html中

<mat-slider thumbLabel class="slider" min="1" max="20" step="1" [formControl]="sliderControl"></mat-slider>

在ts中

...
sliderControl = new FormControl(10);
...
ngOnInit(): void {
    ...
    this.sliderControl.valueChanges.subscribe(value => {
        console.log(value);
    });
}

【讨论】：

【解决方案2】：

要使其实时更新（我用它来指示有预览的渐变角度），您可能需要添加

 (input)="sliderControl.setValue($event.value)"

否则会有一点延迟。

【讨论】：