Provided data source did not match an array, Observable, or DataSource Error

I am receiving the response from an aggregate query from MongoDb collection for generating a report. I am getting this provided data source did not match an array, Observable or DataSource error. Please help.

my response from database is

{
  vitems: [
    { itemQty: -19, count: 3, itemCode: '333.5.23' },
    { itemQty: -24, count: 4, itemCode: '113.77.33' },
    { itemQty: -28, count: 5, itemCode: '77.34.565' },
    { itemQty: -18, count: 3, itemCode: '7611' }
  ]
}

my ts file as

import { AfterViewInit, Component, ElementRef, OnInit, ViewChild } from '@angular/core';
import { MasterService } from '../master.service';
import { MatTableModule, MatTable, MatTableDataSource} from '@angular/material/table'
import { environment } from '../../environments/environment.development';
import { VItem } from '../vitem';


interface Nitem {
              itemQty : number,
              count : number,
              itemCode : string
}


@Component({
  selector: 'app-stock',
  templateUrl: './stock.component.html',
  styleUrl: './stock.component.css'
})
export class StockComponent implements OnInit{

  masterUrl = environment.domain + 'invoices/stock';
  stockItems : Nitem[];
  displayedColumns: string[] = ['itemCode', 'itemQty'];
  
  @ViewChild(MatTable, {static:true}) table!: MatTable<any>;
  
  constructor(private masterService : MasterService){}

  ngOnInit(): void {
    this.masterService.getMasters(this.masterUrl)
    .subscribe(data => {
      this.stockItems = data;
    });
  }
  
}

the HTML file as

    <div  class="container text-center">
              
        <table mat-table [dataSource]="stockItems" #mytable class="my-table mat-elevation-z8">
          
          <ng-container matColumnDef="itemCode">
            <th mat-header-cell *matHeaderCellDef> Item Code</th>
            <td mat-cell *matCellDef="let element"> {{element.itemCode}} </td>
          </ng-container>
      
          <ng-container matColumnDef="itemQty">
            <th mat-header-cell *matHeaderCellDef> Stock</th>
            <td mat-cell *matCellDef="let element"> {{element.itemQty}} </td>
          </ng-container>
      
          <tr mat-header-row *matHeaderRowDef="displayedColumns"></tr>
          <tr mat-row *matRowDef="let row; columns: displayedColumns;"></tr>
        </table>
      
      </div>
      

Could you try accessing the array inside vitems

...
ngOnInit(): void {
    this.masterService.getMasters(this.masterUrl)
    .subscribe((data: any) => {
      this.stockItems = data.vitems;
    });
  }
  ...