im getting the list of object value from API and inside the object there has a property for identify the selected item i am able to bind the items list to view
here is the json data
here is the my code :
<select class="form-control" name="Underwriter">
<option *ngFor="let underwriter of policyModel?.underwriterList" [ngValue]="underwriter.value" >{{underwriter.text}}</option>
</select>
any way to make the selected item ?
You can add just a [selected] to your select and check which underwriter has property selected as true.
like so:
<select class="form-control" (change)="onChangeunderwriter($event)" name="Underwriter">
<option *ngFor="let underwriter of policyModel?.underwriterList" [ngValue]="underwriter.value" [selected]="underwriter.selected == true">{{underwriter.text}}</option>
</select>
So just add:
[selected]="underwriter.selected == true"
A simplified plunker
uw with the preselected value instead.[ngModel] is oneway binding and [(ngModel)] is two way binding :)In your question you say you want to "make" the selected item, which I assume means set it. This is how I have done it, but there might be other better ways.
You need to set the [attr.selected] in the option tag
<select class="form-control" name="Underwriter">
<option *ngFor="let underwriter of policyModel?.underwriterList" [ngValue]="underwriter.value" [attr.selected]="underwriter.text === underwriterTextString ? true: null">{{underwriter.text}}</option>
</select>
Then it your code you need to set underwriterTextString when the WebService API returns a result.
If underwriter.text does not work then try underwriter.value
However, in your comment below you now say that you want to "get" the selected item. This can be done by using the change event in the select tag
<select class="form-control" (change)="onChangeunderwriter($event)" name="Underwriter">
<option *ngFor="let underwriter of policyModel?.underwriterList" [ngValue]="underwriter.value" [attr.selected]="underwriter.text === underwriterTextString ? true: null">{{underwriter.text}}</option>
</select>
Then in your code your need something like this;
onChangeunderwriter(event) {
//the value will be set in event.target.value;
}
