设置表值时方法和类字段的区别

Question

我遇到了一个问题，无法从表格中选择和复制文本，因为每次单击表格时都会刷新并呈现表格。当我将使用该方法将表值设置为版本一的版本更改为使用类字段的版本二时，问题就解决了。有人可以向我解释为什么吗？该表被放置在模式对话框中。

成分：

@Input() details: any;
protected metadata: any;

ngOnInit(): void {
  this.metadata = this.getMetadata();
}

getMetadata() {
  return [{
    date: this.details.revisionInfo.timestamp
  }];
}

版本1：

<p-table [value]="getMetadata()">
  <ng-template pTemplate="header">
    <tr>
      <th scope="col">Date</th>
    </tr>
  </ng-template>
  <ng-template pTemplate="body" let-rowData>
    <tr>
      <td>
        {{rowData.date}}
      </td>
    </tr>
  </ng-template>
</p-table>

版本2：

<p-table [value]="metadata">
  <ng-template pTemplate="header">
    <tr>
      <th scope="col">Date</th>
    </tr>
  </ng-template>
  <ng-template pTemplate="body" let-rowData>
    <tr>
      <td>
        {{rowData.date}}
      </td>
    </tr>
  </ng-template>
</p-table>

Answer 1

当您执行

getMetadata()

时，每次更改检测都会调用该方法。这可能根本不是问题，但它也可能给您的组件带来巨大的性能下降。这取决于具体情况。

如果您有能力学习和理解变更检测 - 这样做，您将能够区分可以在模板中留下方法调用的情况。但一般来说，最好将值保存为组件属性并在模板中引用它。