在angular中，是否可以在模板内部创建一个复制对象？

Question

我有一个类似的代码：

<ng-container *ngFor="let hero of heroes">
   <my-comp [CurrentHero]="hero"></mycomp>
</ng-container>

现在，在我的应用程序中，英雄数组从不更改引用，只更新他自己的值。

所以，“英雄”也从来没有新的参考。

但是，我希望组件“my-comp”采用 OnPush 策略。所以我需要@Input CurrentHero 每次都有新的引用，而这并没有发生。

是否可以将英雄复制到模板中作为新参考？

类似于：

<my-comp [CurrentHero]="{...hero}" ></my-comp>

提前致谢。

Answer 1

好吧，如果您要使用不变性，那将是一种反模式。

你应该做的是，当你改变英雄的价值时，你应该总是 return 新对象到 heroes 变量。

我不知道您如何更改 heroes 个别属性的值，但如果您这样做

changingHeroes() {
  let newHeroes = JSON.parse(JSON.stringify(this.heroes));

  newHeroes[0].something = 123;

  this.heroes = newHeroes;
}

注意JSON.parse(JSON.stringify(this.heroes))这是对对象进行深拷贝。像 {...this.heroes} 一样传播它会保留对该数组中每个单独对象的旧引用。

In angular, is it possible inside the template to create a copy object?