I'm using WebApi to return an array of objects. When I'm trying to show the returned data in ngFor loop it gives this comment in elements:"" When I tried showing the static array in ngFor loop it worked but when it's dynamic data it won't work. What should I do? This is the html:

    <table style="width: 100%">
        <tr>
            <th>شماره سریال</th>
            <th>آدرس سایت</th>
            <th></th>
        </tr>
        <tr *ngFor="let item of serialModel">
            <td>{{item.Serial}}</td>
            <td>{{item.RegisterWebsite}}</td>
            <td><qr-code [value]="item.Barcode"></qr-code></td>
        </tr>
    </table>

This is the method:

async OnSearch(Model) {
    this.SearchModel = Model;       
    this.CurrentService.postApiSerialNumberPrintListSerialsResponse(
        Model
    ).subscribe((x) => {
        this.serialModel = x.body;
        console.log("model isssssssssss", this.serialModel);
    });
}

This is the log of my returned data:

Edit: This is ngInit method where I call onSearch:

ngOnInit() {
    this.SearchModel = this.sharedService.SearchModel;
     this.OnSearch(this.SearchModel);
}

CodePudding user response：

remove async in this method OnSearch(Model)