如何使用OnPush策略更新Angular UI而不更改@Input引用？

我有一个具体的组件，它用一个@Input（）

数据扩展了一个抽象类。一个@Input
data
被一个预处理表用来显示行。打底台使用角度推送策略

当我将一个对象推送到@Input
data
数组时，更改不会反映在UI中

如果我在将对象推送到数组后（通过类似于this.data=deepCopy（this.data）的字段[]更改
data
的引用，那么更改将显示在UI中

在这种情况下，我不希望更改
数据的引用
，因为其他组件可能会操作该数据，我也不希望同步同一数据的多个不同副本

如何在不更改引用的情况下强制Angular更新UI？ChangeDetectorRef.detectChanges（）不会相应地更新UI

带素数表的抽象表类：

@Directive()
export abstract class TableComponent<T> implements OnChanges {

  @Input() data: T[];

  @ViewChild('dt') dataTable: Table; // PrimeNG table which displays rows of data

  ...
}

@指令（）
导出抽象类TableComponent实现OnChanges{
@输入（）数据：T[]；
@ViewChild（'dt'）dataTable:Table；//初始化显示数据行的表
...
}

带有addRow（）函数的具体类：

@Component({
  selector: 'app-table',
  templateUrl: '...',
  styleUrls: ['...']
})
export class SomeComponent extends TableComponent<Field> implements OnInit, OnChanges {

  ...

  public addRow(): void {
    const field = {} as Field;
    field.id = 1;
    
    this.data.push(field);

    // this.changeDetectorRef.detectChanges(); // Does not update the UI
    // this.data = deepCopy(this.data) as Field[]; // Updates the UI by changing reference
  }
}

@组件({
选择器：“应用程序表”，
templateUrl:“…”，
样式URL:['…']
})
导出类SomeComponent扩展TableComponent实现OnInit、OnChanges{
...
public addRow（）：void{
常量字段={}作为字段；
field.id=1；
此.data.push（字段）；
//this.changeDetectorRef.detectChanges（）；//不更新UI
//this.data=deepCopy（this.data）as字段[]；//通过更改引用更新UI
}
}
我想出了一个解决方案，可以使UI正确更新

将priming table
value
属性绑定到返回所有预期数据的函数可以解决UI不更新的问题

public addRow(): void {
    const field = {} as Field;
    field.id = 1;
    
    this.data.push(field);
}

public getData(): Field[] {
    return this.data.filter(field => field.id > 0);
}

组件模板代码段：

<p-table #dt [columns]="cols"
             [value]="getData()"
             [paginator]="true"
             [paginatorPosition]="'both'"
             [rows]="10">
...


...