Question

我将数据从模态添加到数据库，添加数据后我想重置模态中的下拉值

以下是这些下拉列表的代码：

<div class="form-group">
<label class="control-label dash-control-label col-sm-3" for="">Tax:</label>
<div class="col-sm-3">
<select id="taxSelect" class="form-control dash-form-control select2" style="width: 100%;" data-minimum-results-for-search="Infinity">
  <option disabled [ngValue]="null">-/-</option>
  <option *ngFor="let tax of taxes" [value]="tax.id">
    {{tax.title}}
  </option>
</select>
</div>

<label class="control-label dash-control-label col-sm-3" for="">UoM:</label>
<div class="col-sm-3">
<select id="unitOfMeasureSelect" class="form-control dash-form-control select2" style="width: 100%;" data-minimum-results-for-search="Infinity">
  <option disabled [ngValue]="null">-/-</option>
  <option [value]="um.id" *ngFor="let um of unitOfMeasures">{{um.title}}</option>
</select>
</div>
</div>

正如你可以看到的那样，我的下拉列表的默认值是

<option disabled [ngValue]="null">-/-</option>

所以我想知道如何在提交和关闭此模式后，将这些选项/下拉值重新设置为默认状态（对于此值：＆＃34; - / - ＆＃34;）.. < / p>

现在触及下拉菜单时，如果它再次打开，它会显示之前选择的值，我想避免这种情况...

谢谢你们干杯

Answer 1

您可以在方法提交$('#taxSelect').val(null)

中使用

Answer 2

只需在select节点上使用ngModel指令并将其绑定到变量。并在提交数据后将值设置为null。顺便说一下：如何在没有ngModel的情况下读取所选值？

<select [(ngModel)]="selectedUnit">
    <option [ngValue]="null">-/-</option>
    <option [value]="um.id" *ngFor="let um of unitOfMeasures">{{um.title}}</option>
</select>

打字稿代码可能如下所示：

export class MyFormComponent {

    public selectedUnit: any = null;

    constructor() {}

    public submitForm(form: NgForm): void {
        //do some server call
        this.selectedUnit = null; // set selectedUnit to null so the dropdown value will change
    }
}

您需要将FormsModule导入您的应用

如何在Modal中选择first / default <option>值

2 个答案: