Javascript 避免重新渲染子组件NgRx-Firestore

我正在寻找一种方法来解决这样一种情况：模型的1个属性从firestore更新，但所有细节（子）组件都被重新渲染

例如，我的模型有作者、标题、图像和类似计数。更新NumberOfLikes后，Firestore将发送一个修改的操作，有效负载将通过ngrx中的my ItemReducer：

   case actions.MODIFIED:
        return itemAdapter.updateOne({
            id: action.payload.url,
            changes: action.payload
        }, state);

这只会更新我的项目数组中的一个对象，但是当子组件为该特定项目更新时，它会重新呈现所有4个属性，而不仅仅是likeCount，从而导致恼人的闪烁

我认为我在父组件和子组件中实现的ChangeDetectionStrategy在这里没有帮助。想知道是否有办法让子组件只更新likeCount属性

据我所知，ngrx正在传递一个新的引用，我使用的异步管道也在重新呈现子组件

谢谢你抽出时间。如有任何建议，我将不胜感激

容器组件：

import { Component, OnInit, ChangeDetectionStrategy } from '@angular/core';
import { Item } from './../../../models/item';

@Component({
    selector: 'app-specials',
    styleUrls: ['specials-list.component.scss'],
    template: `
<div *ngIf="items$ | async; let items; else noItems">
  <app-item-detail
    *ngFor="let item of items"
    [detail]="item">
  </app-item-detail>
</div>`,
    changeDetection: ChangeDetectionStrategy.OnPush
})
...
ngOnInit() {
    this.items$ = this.store.select(fromItem.selectAll);
}
...

---

最后才把

likecount

拉到一个服务中。从一开始就应该这样设计

import { Component, OnInit, ChangeDetectionStrategy } from '@angular/core';
...
@Input()
detail: Item;