我正在从事离子项目。在单击按钮时,请求即被处理,并接收数据,如下所示:

   public login() {
    //this.showLoading()
    var test33;
    this.auth.login(this.registerCredentials).subscribe(data => {
      console.log(data["_body"])
      test33 = data["_body"]
      console.log(test33)
    },
      error => {
        this.showError(error);
      });
  }


鉴于:

 <ion-row class="logo-row">
        <ion-col></ion-col>
        <h2  *ngFor="let user0 of test33">{{ user0.name }}</h2>
        <ion-col width-67>
          <img src="http://placehold.it/300x200"/>
        </ion-col>
        <ion-col></ion-col>
      </ion-row>`


在控制台上,我在test33变量中接收数据为:

 [{"id":1,"role_id":1,"name":"Dr. Admin","email":"[email protected]","avatar":"\/user\/1\/profile\/HR1-dummy-avater.png","password":"$2y$10$iEpnh6pJ09rxH5NFFCVzaewBCxC\/FHZuHnkWA6qUrOBO3tYIBbsVC","remember_token":"VgwXUdIpL6EqW7Fp66VGRPjSKE727Inc4MTseJQq84cTCglkS335KCqVnavu","created_at":"2017-05-25 22:46:10","updated_at":"2017-06-14 05:19:52","is_feature":null}]


但是{{user0.name}}不返回名称。

请指出我在哪里犯错。

最佳答案

您将test33用作变量而不是属性,这意味着ngFor无法在组件的属性上查看test33。

因此,您要做的就是将test33声明为属性this.test33;,然后ngFor会知道该属性。

记住
如果要在模板上的代码中使用var,则必须将其声明为组件属性。

希望对您有帮助。

编辑:

import { Component } from '@angular/core';

@Component({
  selector: 'home-page',
  templateUrl: 'home.html'
})
export class HomePage {

  test33;
  andAnyPropYouWantHere;

  constructor() {}

}


然后,您在那里声明的所有道具都可以与ngFor,ngIf以及其他许多模板一起在模​​板上使用:)

关于javascript - 如何在angular2或Ionic中应用* ngFor,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/44692001/

10-11 13:33