Nikas ┼Żalias Nikas ┼Żalias - 1 year ago 149
ASP.NET (C#) Question

How to bind ASP.NET Core null to Angular2 null?

So I have web app that is made of .net core and angular2. Thing is that from my DB I send currency parameter to angular2. For now my currency is NULL, so angular2 gets state.user.currency = null. My dropdown looks like that:

<p>Currency</p>
<select class="custom-select col-md-6" [(ngModel)]="state.user.currency">
<option class="col-md-6" *ngFor="let currency of CURRENCIES" value="{{currency.id}}">{{currency.name}}</option>
</select>


CURRENCIES looks like that:

public CURRENCIES: any = [
{ id: <any>null, name: "Original currencies" },
{ id: "EUR", name: "Euro" },
{ id: "USD", name: "US Dollar" },
{ id: "AUD", name: "Australian Dollar" }
]


I want that when angular2 gets currency as null my dropdown would should selected option as "Original currencies", but now I get just empty box like this:

enter image description here

How to correctly bind null values??

Answer Source

You should bind using the proper binding expression using the "box" notation: [value]="currency.id"

Code:

<select class="custom-select col-md-6" [(ngModel)]="state.user.currency">
    <option class="col-md-6" *ngFor="let currency of CURRENCIES" [value]="currency.id">{{currency.name}}</option>
</select>
Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download