0
votes

la fonction async ne fonctionne pas lorsqu'elle est appelée dans ngOnInit

En angulaire, j'utilise un service pour obtenir l'emplacement actuel de la page et changer le titre de la page en conséquence et pour cela, j'utilise une fonction async qui fonctionne normalement cas où un bouton est enfoncé mais lorsque la page se charge et dans ngOnInit cela ne fonctionne pas dans l'ordre.

  this.commonService.getPageName().then(data=>{
  this.pageName = data
})

contrôleur

async getPageName(): Promise < any > {

    await this.router.events.subscribe(event => {

        if (event instanceof NavigationEnd) {
            console.log("url ", event.url);
            var index = this.pageNameHeader.findIndex(function(page) {
                return page.location == event.url.replace("/", "");
            })
            this.pageName = this.pageNameHeader[index].name
        }
    });
    console.log(this.pageName, " initialize");

    return this.pageName;
}

angular

3 commentaires

Je ne pense pas que vous puissiez attendre les observables. Vous devrez diriger et taper pour ce que vous faites dans le rappel d'abonnement, puis appeler toPromise au lieu de subscribe pour que cela fonctionne.

je n'utilise pas observable ici au lieu de celui-ci, j'utilise promise afin d'utiliser la fonction d'attente asynchrone

Mais this.router.events renvoie un observable. De plus, this.router.events.subscribe renvoie un Abonnement que vous ne pouvez pas du tout attendre. De plus, vous renvoyez this.pageName qui n'est pas une Promise , c'est une chaîne . Vous devriez vraiment utiliser un IDE approprié pour vous parler de ces erreurs.

3 Réponses :

2
votes

Réécrire pour utiliser une promesse correcte devrait aider

async ngOnInit() {
  this.pageName = await this.getPageName();
}

Alors vous pouvez faire

getPageName(): Promise <any> {
    return new Promise((resolve, reject) => {
        this.router.events.subscribe(event => {
            if (event instanceof NavigationEnd) {
                console.log("url ", event.url);
                var index = this.pageNameHeader.findIndex(function(page) {
                    return page.location == location.pathname.replace("/", "");
                });
                if (index) {
                    resolve(this.pageNameHeader[index].name);
                } else { 
                    reject();
                }
            }
        });
    });
}

0 commentaires

0
votes

Vous attendez un objet Subscription , qui n'est ni une promesse ni une promesse.

Vous pouvez convertir votre Observable en Promise en utilisant la méthode toPromise Â:

const event = await this.router.events.toPromise();
if (event instanceof NavigationEnd) {
// etc

0 commentaires

0
votes

Le mot-clé await ne fonctionne que sur l'objet Promise , mais l'expression this.router.events.subscribe () renvoie un Subscription objet.

Vous devriez essayer d'utiliser la méthode toPromise () des observables:

async getPageName(): Promise < any > {
    await this.router.events.toPromise().then(event => {
        if (event instanceof NavigationEnd) {
            console.log("url ", event.url);
            var index = this.pageNameHeader.findIndex(function(page) {
                return page.location == location.pathname.replace("/", "");
            });
            this.pageName = this.pageNameHeader[index].name
        }
    });
    console.log(this.pageName, " initialize");
    return this.pageName;
}

0 commentaires