Interaktion zwischen ngAfterViewInit und Observable im Angular-Lebenszyklus
P粉131455722
P粉131455722 2023-08-16 19:03:09
0
1
413

enable.service.ts

@Injectable({ bereitgestelltIn: 'root' }) Exportklasse EnableService { isEnabled$ = from(this.client.init()).pipe( switchMap(() => this.client.getEnabled()), map(([enabled, isAdmin]) => ({enabled: true, isAdmin: false})), Aktie() ); // 不完全是这样, 但是是一种返回enable und isAdmin的observable Konstrukteur( // 一些构造函数 ) {} }

main.component.ts

export class MainComponent implementiert OnInit, AfterViewInit, OnDestroy { @ViewChild('mymap') containerRef: ElementRef; isAdmin: boolean = false; isEnable: boolean = false; Konstrukteur( privater enableService: EnableService, ) { this.enableService.isEnabled$.subscribe(res => {this.enable = res.enabled; this.isAdmin = res.isAdmin}); } async ngAfterViewInit(): Promise { // HACK: Ermöglicht den Zugriff auf „enableService“, um die ContainerRef-Funktion #mymap zu verwenden Warten auf neues Versprechen(resolve => setTimeout(resolve, 1000)); // 必须存在才能正确隐藏/移除地图 if (this.containerRef) { // 一些第三方方sdk初始化只有在containerRef存在时才执行 } }

main.component.html

,它将会出错。

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

为true, 会导致问题, 同样, 如果它一开始就是true,最终还是true,也会导致错误.我尝试将observable的订阅从构造函数移到ngOnInit中,也不起作用.

P粉131455722
P粉131455722

Antworte allen (1)
P粉026665919

试试这个有用吗?

ts

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

html

    Neueste Downloads
    Mehr>
    Web-Effekte
    Quellcode der Website
    Website-Materialien
    Frontend-Vorlage
    Über uns Haftungsausschluss Sitemap
    Chinesische PHP-Website:Online-PHP-Schulung für das Gemeinwohl,Helfen Sie PHP-Lernenden, sich schnell weiterzuentwickeln!