如何在angular2中重置'ss-multiselect-dropdown'答案

【问题标题】：How to reset 'ss-multiselect-dropdown' in angular2如何在angular2中重置'ss-multiselect-dropdown'
【发布时间】：2017-10-16 11:06:51
【问题描述】：

我使用这个包在 angular2 中为我的表单使用了多选下拉控件：https://github.com/softsimon/angular-2-dropdown-multiselect

我想在点击表单的重置按钮时重置这个控件。

<form [formGroup]="myForm" (ngSubmit)=save()>
    <ss-multiselect-dropdown [options]="myOptions" formControlName="optionsModel"></ss-multiselect-dropdown>
    <button type="reset" class="btn btn-default">Reset</button>
    <button type="submit" class="btn btn-primary">Submit</button>
</form>

任何帮助将不胜感激。谢谢

【问题讨论】：

您已经完成了reset type 按钮。你有什么问题？
带有重置按钮的其他字段已重置，但<ss-multiselect-dropdown>没有。
因此您必须在问题中明确说明您面临的问题，并发布您的预期输出。我稍后会发布答案，请检查。
谢谢@Pengyy。问题已解决。
不客气。 :)

标签： angular package angular2-forms multi-select ngx-bootstrap

【解决方案1】：

对于model-driven 表单，您可以通过调用patchValue 来重置formControl 的值。

reset() {
  this.myForm.get("optionsModel").patchValue([]);  // here multiselect should be reset with an empty array.
}

PLUNKER DEMO

【讨论】：

【解决方案2】：

在按钮点击事件中需要设置默认值。

前：

ngclick(): void {

        this.colours = Array<Colour>();
        this.colours.push(new Colour(-1, 'Please select'));
        this.colours.push(new Colour(1, 'Green'));
        this.colours.push(new Colour(2, 'Pink'));

        this.car = new Car();
        this.car.colour = this.colours[1];        
    }

【讨论】：

【解决方案3】：

TS：

onReset() {
   this.myForm.reset({
     optionsModel: ['']
   })
}

【讨论】：

虽然此代码可能会回答问题，但提供有关此代码为何和/或如何回答问题的额外上下文可提高其长期价值。