Question

我有一种情况，我想通过 ng-select 上的自我更改事件将默认值设置为null。如果用户首先选择下拉菜单，则在发生更改事件时应检查Amount模型是否为null或为空，如果Amount模型为空白，则应将ng-select设置为null。

该下拉列表设置为null仅适用于第一次。

在HTML组件中

<input type="text" [(ngModel)]="Amount"/><br/><br/>
<label>Your ng-select</label><br/>
<ng-select [items]="currencyList"
           bindLabel="name"
           bindValue="name"
           placeholder="Select Currency"
           [(ngModel)]="selectedCurrency"
           (change)="onChangeDropdown()">
</ng-select><br/>

在更改事件功能的打字稿中

onChangeDropdown(){
  if(this.Amount){

  }else{
    this.selectedCurrency = null;
    alert("enter amount first");
  }
}

在这里，我具有附加链接：link for dropdown example

即使我也在正常的html select下拉菜单中进行了测试，这也显示出与上述相同的输出结果

<select [(ngModel)]="selectedCurrency" class="form-control" (change)="onChangeDropdown()">
    <option>--Select Currency--</option>
    <option *ngFor="let c of currencyList" value="{{c.id}}">{{c.name}}</option>
</select>

为什么在 ng-select 上仍显示INR或其他货币名称？

我已经发布了相同的问题，但是在这里Set default dropdown bindLabel in @ng-select/ng-select on self change event in Angular?找不到正确的解决方案？

Answer 1

您正在按名称绑定ngSelect。

bindLabel="name"
bindValue="name"

，如果您更改，则selectedCurrency是任意类型

this.selectedCurrency = null; //to
this.selectedCurrency = {}; //it will work. just try this

Answer 2

使用setTimeOut强制Angular显示空值

onChangeDropdown(){
      if(this.Amount){
      }else{
        alert("enter amount first");
        setTimeout(()=>{
          this.selectedCurrency = null;
        },0)
      }
    }

在Angular 5/6中的自更改事件中，在@ ng-select / ng-select中设置默认下拉bindLabel吗？

2 个答案: