打字稿获取 JSON 对象

Question

我已经从请求中获取了一些数据，它应该将其作为 json 对象返回，我可以将其传递给并在某些 html 中使用，但是当运行时

console.log(this.data);

我还可以看到它在文章数组中有 20 个元素，但是当我运行时它返回 undefined 或 null

console.log(this.data.__zone_symbol__value);

对于解决此问题的任何帮助将不胜感激。 :)

根据评论进行编辑：

  ngOnInit() {
    this.url = 'https://newsapi.org/v2/top-headlines?' +
        'country=us&' +
        'apiKey=c6aecd1cd1de49edaca2544076713c45';
   this.Newsdata = this.FetchHeadlines(this.url);

   console.log(this.Newsdata);
   console.log(this.Newsdata.__zone_symbol__value);

}

get(url: string): Promise<any> {
    return new Promise((resolve, reject) => {
        var req = new XMLHttpRequest();
        req.open('GET', url);

        req.onload = () => {
            if (req.status === 200) {
                resolve(req.response);
            } else {
                reject(Error(req.statusText));
            }
        };

        req.onerror = () => {
            reject(Error('Network Error'));
        };

        req.send();
    });
}

FetchHeadlines(url: string): Promise<any> {
    console.log("Entered FetchHeadlines");

    return this.get(url).then(JSON.parse).catch(error => {
        console.log('getJSON failed for', url, error);
        throw error;
    });
}

Answer 1

使用这一行 JSON.parse() 方法一切正常。

第一道

private getCall() {
        let url = "https://newsapi.org/v2/top-headlines?country=us&apiKey=c6aecd1cd1de49edaca2544076713c45";
        console.log("Entered FetchHeadlines");

        this.FetchHeadlines(url).then((response)=>{
            let Data=JSON.parse(response);
            console.log("Data",Data);
            console.log("Data1",Data.articles);

        })      
    }
    get(url: string): Promise<any> {
        return new Promise((resolve, reject) => {
            var req = new XMLHttpRequest();
            req.open('GET', url);

            req.onload = () => {
                if (req.status === 200) {
                    resolve(req.response);
                } else {
                    reject(Error(req.statusText));
                }
            };

            req.onerror = () => {
                reject(Error('Network Error'));
            };

            req.send();
        });
    }

    FetchHeadlines(url:string): Promise<any> {
        console.log("Entered FetchHeadlines");

        return this.get(url).then().catch(error => {
            console.log('getJSON failed for', url, error);
            throw error;
        });
    }

经过完美测试。 截屏，

第二种方式：-

  private getCall(){
        let url="https://newsapi.org/v2/top-headlines?country=us&apiKey=c6aecd1cd1de49edaca2544076713c45";
            console.log("Entered FetchHeadlines");

            this.http.get(url).subscribe((response)=>{
                console.log("Response1",response);
                console.log("Response2",response.json());   //here got json value you can assign value to variable.         
            })
    }

截图，

我希望它以第一种方式解决您的问题。

谢谢， 穆图库马尔