Search code examples
angularlistdropdown

Angular auto assign drop down

I have a drop down angular select tag here. The drop down wont be selected when value being assign . 

<select [(ngModel)]="controlType" #ctrl="ngModel" class="form-control" [ngModelOptions]="{standalone: true}">
    <option [value]="undefined" selected>SILA PILIH</option>
    <option *ngFor="let alertControl of alertControlList" [ngValue]="alertControl">{{ alertControl?.desc }}
    </option>
</select>

controlType value from DB

{
    "errorCode": null,
    "errorMessage": null,
    "id": "b9e86e1a-cabc-11e8-9257-31ce15c52e16",
    "createdBy": "a6ef4d81-744e-49e7-9e1d-ab74a14935d6",
    "lastModifiedBy": "a6ef4d81-744e-49e7-9e1d-ab74a14935d6",
    "createdDate": 1538977256000,
    "lastModifiedDate": 1538977256000,
    "deleted": null,
    "active": true,
    "version": 0,
    "code": "1",
    "desc": "why"
}

alertControlList value

[{
    "code": "2",
    "version": "0",
    "desc": "why",
    "id": "b9e8bc3b-cabc-11e8-9257-31ce15c52e16",
    "HEX(id)": "B9E8BC3BCABC11E8925731CE15C52E16"
}, {
    "code": "1",
    "version": "0",
    "desc": "why",
    "id": "b9e86e1a-cabc-11e8-9257-31ce15c52e16",
    "HEX(id)": "B9E86E1ACABC11E8925731CE15C52E16"
}]

It's only work when i do a object mapping here . Any other simpler solution?

for (let int i = 0; i < alertControlList.length; i++) {
    if (alertControlList[i].code === dropdown.code) {
        console.log('do MATCH' + i + ' code' + dropdown.code);
        controlType = alertControlList[i];
    }
}
Solution

  • use [selected]="alertControl.code === dropdown.code" instead.