Interaksi antara ngAfterViewInit dan Observable dalam kitaran hayat Sudut

Question

dayakan.service.ts

@Injectable({
  disediakanIn: 'root'
})
kelas eksport EnableService {
  isEnabled$ = from(this.client.init()).pipe(
    switchMap(() => this.client.getEnabled()),
    map(([enabled, isAdmin]) => ({enabled: true, isAdmin: false})),
    kongsi()
  ); // 不完全是这样，但是是一种返回enable和isAdmin的observable

  pembina(
    // 一些构造函数
  ) {}
}

utama.komponen.ts

export class MainComponent melaksanakan OnInit, AfterViewInit, OnDestroy {
  @ViewChild('mymap') containerRef: ElementRef<HTMLDivElement>;

  isAdmin: boolean = false;
  isEnable: boolean = palsu;

  pembina(
    private enableService: EnableService,
  ) {
    this.enableService.isEnabled$.subscribe(res => {this.enable = res.enabled; this.isAdmin = res.isAdmin});
  }

  async ngAfterViewInit(): Janji<batal> {
    // HACK: 需要等待enableService订阅获取实际值，否则containerRef #mymap是否存在将无法确定
    tunggu Janji baru(selesaikan => setTimeout(selesaikan, 1000));

    // 必须存在才能正确隐藏/移除地图
    jika (this.containerRef) {
      // 一些第三方sdk初始化只有在containerRef存在时才执行
    }
  }

main.component.html

<div #mymap *ngIf="!isEnable || isAdmin"></div>

目前这是一个可工作的代码，使用了1秒的延迟 hack在ngAfterViewInit中。问题是如果问题是如果问题是如果问紗是如果远行迟迟在ngAfterViewInit中。问题是如果问题是如果问紗是如果隗街迟它将会出错。

有没有办法确保ngAfterViewInit在enableService获取值之后执行？

或者有没有更好的方法，不用使用那1秒的延迟。如果我将isEnable的初始值设一王值设与会导致问题，同样，如果它一开始就是true，最终还是true，也会导致错误。我尝试将observable的订阅从构造函数移到ngOnInit中，也不;男作

Answer 1

Adakah berguna untuk mencuba ini?

ts

get isEnabled$() {
    return this.enableService.isEnabled$;
}

html

<div #mymap *ngIf="!(isEnabled$ | async).isEnable || (isEnabled$ | async).isAdmin"></div>