Question

Object {0: Object, 1: Object, 2: Object, 3: Object, 4: Object, httpStatus: 200, httpStatusText: null, httpBodyText: "[object Object],[object Object],[object Object],[object Object],[object Object]"}

0:Object (example of object i opened to show content)
CountryInitials : "US"
Id: "101"
CountryName: "United States"
Population: 318.9
__proto__:
Object
1:Object
2:Object
3:Object
4:Object

这是我的浏览器中的一个示例，它显示了我如何接收数据，所以它是一个包含对象的对象，我想在html中将它视为一个数组，我认为它是不行的。 ...

这是html：

<div *ngFor="#obj of myList>
        <div><b>Country ID:</b> {{obj.Id}} <b>Country Name:</b> {{obj. CountryName}}}</div>
      </div>

它不起作用......我不知道为什么，我只想提供一个国家ID和国家名称的对象列表..

EXCEPTION：

EXCEPTION: Error trying to diff '[object Object]' in [myList in EntityBulkCmp@32:31]

有人可以帮我解决这个问题吗？

谢谢！

Answer 1

Exception表示myList中的项目不是唯一的。可能你有一些重复的元素。

Angular需要跟踪它所枚举的项目。

使用trackBy选项，找到下面的语法

<li *ngFor="let item of items; let i = index; trackBy: trackByFn">...</li>

请参阅https://angular.io/docs/ts/latest/api/common/index/NgFor-directive.html以完整使用该指令。

Answer 2

您可以使用管道json在模板中打印对象：https://angular.io/docs/ts/latest/api/common/index/JsonPipe-pipe.html

@Component({
  selector: 'json-pipe',
  template: `<div>
    <p>Without JSON pipe:</p>
    <pre>{{object}}</pre>
    <p>With JSON pipe:</p>
    <pre>{{object | json}}</pre>
  </div>`
})
export class JsonPipeComponent {
  object: Object = {foo: 'bar', baz: 'qux', nested: {xyz: 3, numbers: [1, 2, 3, 4, 5]}};
}

Answer 3

您可以使用key和value打印json格式... 其中key为0,1等（如您的情况）和value是对象（如您的情况）...

无法在HTML中打印对象列表

3 个答案: