ngFor Json对象未显示所需的值

vhmi4jdf  于 2022-11-19  发布在  其他
关注(0)|答案(1)|浏览(111)

我正在尝试进行休息呼叫,然后显示get结果。
我已经用一个更简单的json数据结构/对象成功地完成了它,但是不能让ngFor使用这个特定的数据结构,我已经尝试了一些管道和切片的组合,没有将结果转换为数组等,但是仍然不能访问“项目”下的数据,希望有人能帮助我,我已经花了几个小时试图弄清楚!
get调用正在工作,下面是它的实现方式:

wishlist: any = [];
    url: string = 'xxx'
  
    getWishlist(){
      this.http.get(this.url,this.httpOptions).subscribe((wishlist: any)=>{
        this.wishlist = wishlist;
        this.wishlist = Array.of(this.wishlist);
        console.log(wishlist);
      });
    }

简单的ngfor可以编译但不起作用(只显示名称、年份等,没有值)(我知道它不完整):

<div *ngFor="let wishlist of wishlist">
    <h1>name ~ {{wishlist.name}}</h1>
    <h1>year ~ {{wishlist.year}}</h1>
    <h1>country ~ {{wishlist.country}}</h1>
</div>

get调用可以工作,但我不能正确解析和显示数据的原因是,我看到使用dev工具是成功的,可以看到在那里检索到的数据,json对象的数据结构是我的问题(items parent标记是让我很难的地方,我想,当它不存在时,我有其他调用工作):

{
    "items": [
        {
            "id": 1,
            "name": "Gold American Eagle",
            "year": "1977",
            "country": "USA",
            "links": [
                {
                    "rel": "self",
                    "href": 
                }
            ]
        },
        {
            "id": 2,
            "name": "Gold Mapple Leaf",
            "year": "1973",
            "country": "CANADA",
            "links": [
                {
                    "rel": "self",
                    "href": 
                }
            ]
        },
        {
            "id": 99,
            "name": "Gold Buffalo",
            "year": "1975",
            "country": "USA",
            "links": [
                {
                    "rel": "self",
                    "href": 
                }
            ]
        },
etc.

开发工具:x1c 0d1x
我尝试了slice、pipe,但没有在rest调用时将结果转换为数组,等等。我希望显示rest调用的值,但得到的只是空行:

uttx8gqw

uttx8gqw1#

也许你需要这个:

<div *ngFor="let item of wishlist?.items">
    <h1>name ~ {{item.name}}</h1>
    <h1>year ~ {{item.year}}</h1>
    <h1>country ~ {{item.country}}</h1>
</div>

相关问题