DataView not updating with new data

[Falcon9]

Hi,
I am new to this and am trying to populate a DataView (https://www.primefaces.org/primeng/showcase/#/dataview).

It works fine on page load but it is not updating to show new data when the route changes and updates the source data object. Basically an ID is passed in the route / url and is the passed ID for a DB query that then populates the DataView.

Code: Select all

 @Output() dataViewData: any[];

  constructor(
    private route: ActivatedRoute
  ) {}

  ngOnInit(): void {
    this.route.params.subscribe((params) => {
      this.selectedID = params.id;
      this.getData(this.selectedID);
    });
  }

 this.getData(id){
  const data = 'http GET perfmormed here';
  this.dataViewData = data;
 }

The data is then passed to another component that has the DataView code in it.

Code: Select all

<app-items [data]="dataViewData"></app-items>

<p-dataView #dv [value]="dataViewData" [paginator]="true" [rows]="9" filterBy="Title" [sortField]="sortField"
          [sortOrder]="sortOrder" layout="grid">
...
</p-dataView>

Looking at the documentation I do not see any redraw/refresh even to hook into but as mentioned I am new to this. Should I be looking to solve this with some kind of observable or is there a different and better way to pass the data to the view component?

Thanks in advance!