消费Rest Ionic3

Question

我对web和Ionic3开发很陌生，我遇到了一个问题，我遵循了一个教程来使用rest，我能够将列表与用户一起带来，但是我想要在屏幕上显示一个特定的用户，如果我更改了用户的URL，就会显示出这个错误。

TabCepPage.html:10 ERROR Error: Cannot find a differ supporting object
'[object Object]' of type 'Leanne Graham'. NgFor only supports binding 
to  Iterables such as Arrays.

我的应用是这样的：

提供者: rest.ts

apiUrl = 'https://jsonplaceholder.typicode.com';

constructor(public http: HttpClient) {
  console.log('Hello RestServiceProvider Provider');
}

getUsers() {
  return new Promise(resolve => {
    this.http.get(this.apiUrl+'/users/1').subscribe(data => {
      resolve(data);
    }, err => {
      console.log(err);
    });
  });
}

页面.ts：

users: any;

constructor(public navCtrl: NavController, public restProvider: RestProvider) {
  this.getUsers();
}

getUsers() {
  this.restProvider.getUsers()
  .then(data => {
    this.users = data;
    console.log(this.users);
  });
}

HTML显示等：

<ion-item *ngFor="let user of users">
  <h2>{{user.name}}</h2>
  <p>{{user.email}}</p>
</ion-item>

你能帮我吗？

Answer 1

当试图在代码中获取特定用户时，this.users最终成为一个对象，而不是模板试图为循环所用的数组。您只需要更新模板来显示对象，而不是尝试使用for循环。

example:
<ion-item *ngIf="users">
  <h2>{{users.name}}</h2>
  <p>{{users.email}}</p>
</ion-item>

Answer 2

您可以使用console.log(JSON.stringify(变量名))查看该数组；