1
votes

Angulaire: la propriété 'alors' n'existe pas sur le type 'Observable'

J'utilise Nativescript ici pour créer une application mobile. Il y a une erreur ici. Dans mon développement ASP.Net MVC 5 à l'aide de Visual Studio 2017, il est très bien d'utiliser $ http.get (). Then () , mais pas dans Nativescript.

Veuillez voir le code ci-dessous :

import { Component, OnInit } from "@angular/core";
import { HttpClient } from '@angular/common/http';

@Component({
    selector: "Home",
    moduleId: module.id,
    templateUrl: "./home.component.html",
    styleUrls: ["./home.component.css"]
})
export class HomeComponent implements OnInit {

    constructor(private http: HttpClient) {
    }

    ngOnInit(): void {
        this.http.get('https://somewebsite.com',
            {
                params: { 'sorter': '', 'isAscending': 'true', 'searchString': '', 'currentPage': '1', 'itemsPerPage': '300' },
                headers: {
                    "Authorization": "Basic encryptedcodehere"
                }
            }).then(function (response) {
                var theData = JSON.parse(response.data);
                if (theData.Data != null && theData.Data.length > 0) {
                    log(theData.Data);
                }
            });
    }
}

L'erreur est: La propriété 'then' n'existe pas sur le type 'Observable'. ?

Qu'est-ce que se passe-t-il ici?

angular nativescript

0 commentaires

3 Réponses :

5
votes

.then est la méthode de Promise. Mais vous utilisez un httpClient, qui renvoie Observable. Vous devriez utiliser .subscribe au lieu de , puis.

  ngOnInit(): void {
    this.http.get('https://somewebsite.com',
        {
            params: { 'sorter': '', 'isAscending': 'true', 'searchString': '', 'currentPage': '1', 'itemsPerPage': '300' },
            headers: {
                "Authorization": "Basic encryptedcodehere"
            }
        }).subscribe(function (data) {
            var theData = JSON.parse(data);
            if (theData.Data != null && theData.Data.length > 0) {
                log(theData.Data);
            }
        });
  }

Vous pouvez en savoir plus sur httpClient et Observable chez un fonctionnaire documentation

1 commentaires

La réponse d'Eugène est correcte. Vous pouvez probablement consulter la documentation pour plus de détails.

1
votes

vous pouvez aussi faire comme ceci

import { Component, OnInit } from "@angular/core";
import { HttpClient } from '@angular/common/http';

@Component({
 selector: "Home",
 moduleId: module.id,
 templateUrl: "./home.component.html",
 styleUrls: ["./home.component.css"]
})
export class HomeComponent implements OnInit {

constructor(private http: HttpClient) {
}

ngOnInit(): void {
    this.http.get('https://somewebsite.com',
        {
            params: { 'sorter': '', 'isAscending': 'true', 'searchString': '', 
 'currentPage': '1', 'itemsPerPage': '300' },
            headers: {
                "Authorization": "Basic encryptedcodehere"
            }
        }).subscribe(data => { // no need to write the function you can simply create a arrow function too 
            var theData = JSON.parse(data);
            if (theData.Data != null && theData.Data.length > 0) {
                log(theData.Data);
            }
        });
  }
}

cela jette l'erreur car alors est une méthode de promesse

0 commentaires

2
votes

Utiliser subscribe est probablement la voie à suivre. Cependant, si vous voulez vraiment utiliser puis (ce qui peut être pratique si vous avez besoin d'enchaîner des appels), vous pouvez convertir votre observable en promesse en utilisant la méthode toPromise ()

this.http.get('https://somewebsite.com',
{
    //... 
}).toPromise().then(response => {
       //...
        });

2 commentaires

Cette approche n'est bonne que si vous avez besoin de vous promettre une compatibilité avec un code ancien ou tiers. Sinon, il est recommandé d'utiliser .subscribe ou .do.

Mais si vous utilisez .do pour y mettre votre code, vous devez appeler .subscribe dans tous les cas. C'est comment fonctionne observable. Il ne peut renvoyer des données que pour ceux qui sont abonnés.