I have a scenario where I need to set the default value to null in the ng-select.
If the user selects an option from the dropdown first, then on the change event it should check if the Amount model is not null or blank. If the Amount model is blank, then the ng-select should be set to null.
In the HTML component:
<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/>
In the typescript file for the onchange event function:
onChangeDropdown(){
if(this.Amount){
} else {
this.selectedCurrency = null;
alert("Please enter an amount first");
}
}
Here is the link to the dropdown example: Dropdown Example
I also tested with a normal HTML select dropdown and encountered the same issue as mentioned above.
<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>
It only works for the first time. When I try to select more than once, it doesn't work properly. Why does it still show INR or another currency name in the dropdown list?