Question

我正在尝试从JSON对象中获取某些元素以显示在我的html中，但是我无法在我的应用中这样做。我在做什么：

从我的服务中的steamAPI中获取JSON（成功，我可以在console.log中看到整个JSON）
将服务中的JSON传递给我的组件（成功的话，如果*ngIF=items失败，浏览器将什么也不显示）
我尝试使用代码market_hash_name从JSON获取icon_url和<li ng-repeat="(key,value) in items.rgDescriptions">（失败，ng-repeat有效，但浏览器显示错误ERROR TypeError：“ _ co。值未定义”）

<p>{{ value.market_hash_name }} <button>Add to your list</button></p> 这失败了

我在w3schools中做了一个try-it示例来尝试ng-repeat函数。我将JSON复制到示例中（必须将其缩短以适合它），并且可以正常工作。 https://www.w3schools.com/code/tryit.asp?filename=FZ6HYMY2YP2P

该示例在w3上有效，但是当我将相同的代码（在某种程度上将整个内容粘贴到我的东西上）粘贴到我的项目中时，它将失败，并显示“ ERROR TypeError：“ _ co.value is undefined”错误。看来问题出在我的专案中，但找不到。

如何解决此问题？

我的代码：

import { Component, OnInit } from '@angular/core';
import { ApiService } from '../../api.service';

@Component({
  selector: 'app-itemlist',
  templateUrl: './itemlist.component.html',
  styleUrls: ['./itemlist.component.scss']
})
export class ItemlistComponent implements OnInit {

  constructor(private api: ApiService) { }
  
  items: Object;


  ngOnInit() {

    this.api.getItems().subscribe(data => {
        this.items = data;
        console.log(this.items);
      }
    );
  }

}

<h1>Users</h1>


<ul *ngIf="items">
  <li ng-repeat="(key,value) in items.rgDescriptions"> 
    <img src="http://cdn.steamcommunity.com/economy/image/{{value.icon_url}}" class="img-responsive" />
    <p>{{ value.market_hash_name }} <button>Add to your list</button></p>
  </li>
</ul>

`

Answer 1

没有 ng-repeat 带有角，您需要使用 ngFor ，

 <li *ngFor="let (key,value) of items.rgDescriptions"> 
    <img src="http://cdn.steamcommunity.com/economy/image/{{value.icon_url}}" class="img-responsive" />
    <p>{{ value.market_hash_name }} <button>Add to your list</button></p>
  </li>

ng-repeat值未定义

1 个答案: