Question

我正在使用ngForm，在我的表单底部，我有一个重置按钮。当我单击重置时，整个表单将重置，但不会恢复在我的ts模型中建立的初始模型值。

当我点击重置按钮而不是清除整个表单时，如何确保下面的模型存在？

ts文件中的

：

 model = {
  color: 'Red',
  size: 'XS',
  age: '34'
};

HTML：

        <div class="form-group">
            <label for="region">Select Color</label>
                <input id="color" class="form-control" name="color"
                    [(ngModel)]="model.color" [typeahead]="colors" required>
        </div>

        <div class="form-group">
            <label for="region">Select Size</label>
                <input id="size" class="form-control" name="size"
                    [(ngModel)]="model.size" [typeahead]="sizes" required>
        </div>

        <div class="form-group">
            <label for="age">Select Color</label>
                <input id="age" class="form-control" name="age"
                    [(ngModel)]="model.age" [typeahead]="ages" required>
        </div>

Answer 1

非常简单，只需在ngform's reset方法中传递默认值的对象，以便进一步参考app。

  resetFormWithDefaultValues(){
    this.slForm.reset(this.defaultValues);
  }

将ngModel值重置为默认模型？

1 个答案: