Change event not triggering while updating select option programmatic using selectedIndex in angular 9

Question

I am importing XML content and based on data inside want to update the selected option in the dropdown. Drop Down selection is getting updated but ng-value I have bound is not getting updated automatically. The same thing works when I use UI and update drop-down selection using a mouse click. below is code I am using:

<select [(ngModel)]="mypage.DataList[i].PO" [id]="'objml-'+i" [ngModelOptions]="{standalone: true}"   (change)="updateLcso(i, $event)">
 <option *ngFor="let x of poList; trackBy:trackByIndex;" [ngValue]="x" >{{x.po_tag}}</option>

So using the above code works fine when using mouse click and change option in the dropdown. and when I read mypage.DataList[i].PO content, data accurately updated.

I want to update the drop-down option programmatically and using the below code.

(document.getElementById("objml-" + index.toString()) as HTMLSelectElement).selectedIndex = 1;

using the above logic, on UI page drop-down option is getting updated but when I read mypage.DataList[i].PO content, data is still not updated

Help is appreciated, Thanks in advance.