异步调用后，Angular UI未更新ngFor

data: Observable<any[]>;

// 异步操作
getData() {
  this.data = this.myService.getData();
}

<div *ngFor="let item of data | async">
  {{ item }}
</div>

import { Component, ChangeDetectionStrategy, ChangeDetectorRef } from '@angular/core';

@Component({
  selector: 'app-my-component',
  templateUrl: 'my-component.component.html',
  changeDetection: ChangeDetectionStrategy.OnPush
})
export class MyComponent {
  data: any[];

  constructor(private cdr: ChangeDetectorRef, private myService: MyService) { }

  // 异步操作
  getData() {
    this.myService.getData().subscribe((result) => {
      this.data = result;
      this.cdr.markForCheck(); // 标记组件为需要更新
    });
  }
}

import { from } from 'rxjs';

this.data = from(this.myService.getData());