在 Angular 的 OnPush 变更检测策略下，即使通过展开运算符创建了新数组引用，视图仍可能不更新；根本原因是 OnPush 仅响应输入属性（@Input）变更或异步管道触发，而组件内部状态赋值不会自动激活检测，需手动调用 ChangeDetectorRef.detectChanges()。
在 angular 的 `onpush` 变更检测策略下，即使通过展开运算符创建了新数组引用，视图仍可能不更新；根本原因是 `onpush` 仅响应输入属性（`@input`）变更或异步管道触发，而组件内部状态赋值不会自动激活检测，需手动调用 `changedetectorref.detectchanges()`。
当使用 ChangeDetectionStrategy.OnPush 时，Angular 不再周期性检查组件及其子树的绑定变化，而是仅在以下明确事件发生时才执行变更检测：
- 组件的
@Input()输入属性引用发生变化（浅比较）； - 组件模板中使用了
AsyncPipe（如{{ data$ | async }}），且 Observable 发出新值； - 用户事件（如点击、输入）发生在该组件模板内（注意：事件必须由组件自身模板直接捕获，父组件事件不会触发子组件 OnPush 检测）；
- 手动调用
ChangeDetectorRef.detectChanges()。
在你的示例中，periodData$ 是一个 @Input() 输入的 Observable，但你选择在组件内部 subscribe 并将结果赋值给本地字段 this.periodData = [...pd]。这一操作不构成 @Input() 引用变更（因为 periodData$ 本身未变），也未使用 AsyncPipe，因此 Angular 完全不会为此触发 OnPush 检测——即使数组引用已更新，模板仍保持旧状态。
✅ 正确解法是显式通知 Angular 进行一次局部检测：
import { ChangeDetectionStrategy, Component, Input, OnInit, ChangeDetectorRef } from '@angular/core';
import { NgFor } from '@angular/common';
import { Observable } from 'rxjs';
@Component({
selector: 'app-detect',
template: `<div *ngFor="let p of periodData">{{ p }}</div>`,
changeDetection: ChangeDetectionStrategy.OnPush,
})
export class DetectComponent implements OnInit {
@Input() periodData$!: Observable<string[]>;
periodData: string[] = [];
constructor(private cdr: ChangeDetectorRef) {}
ngOnInit() {
this.periodData$.subscribe(pd => {
console.log('New period data:', pd);
this.periodData = [...pd]; // ✅ 新引用，但不足以触发 OnPush
this.cdr.detectChanges(); // ✅ 关键：主动触发当前组件的变更检测
});
}
}⚠️ 注意事项：
- 避免在循环或高频事件中频繁调用
detectChanges()，可能影响性能； - 更推荐的模式是移除手动订阅，改用模板层
AsyncPipe：<div *ngFor="let p of (periodData$ | async)">{{ p }}</div>此时无需
ChangeDetectorRef，AsyncPipe内部会自动触发OnPush检测，代码更简洁、可维护性更高； - 若必须在 TS 层处理数据（如转换、过滤），可结合
map+async：@Input() set periodData$(value: Observable<string[]>) { this._periodData$ = value.pipe(map(pd => pd.map(p => p.toUpperCase()))); } private _periodData$!: Observable<string[]>;模板中仍用
(_periodData$ | async)，保持声明式与响应式优势。
总结：OnPush 不是“监听变量变化”，而是“等待明确信号”。理解其触发边界，善用 AsyncPipe 或 ChangeDetectorRef，才能真正发挥其性能优势。
