如何使用 ng-repeat 访问数组中的对象？

Question

我在使用 ng-repeat 时遇到问题。我正在使用带有 TypeScript 和 HTML5 的 Ionic 2。我创建了一个对象数组，我需要在其中访问它的属性。它说“无法读取未定义的属性 c.getAttribute”，但是当我尝试不使用 ng-repeat 访问这些属性时（只需键入数组 [0].getAttribute），一切正常。 这是我的代码：

    <ion-list>
      <ion-item ng-repeat="c in card">
        <ion-card class="styledRow">
          <ion-item class="cardHeaderClass">
            <font size="4" style="color:#FFFFFF;">{{c.getExpiration}}</font>
            <p>Monthly student</p>
          </ion-item>
          <ion-item class="rangeSlider">
            <p style="color:white">Perm</p> 
            <ion-badge color="blue" item-right>{{c.getPermValue}}/{{c.getTotalValue}}{{c.getDayEuro}}
            </ion-badge>
          </ion-item>
          <ion-item class="rangeSlider">
            <ion-range disabled="false" min="0" max="{{c.getTotalValue}}" step="1" [(ngModel)]="c.getPermValue" color="secondary">
              <ion-icon range-left  name="close" color="danger"></ion-icon>
              <ion-icon range-right  name="checkmark-circle-outline" color="secondary"></ion-icon>
            </ion-range>
          </ion-item>
          <ion-row class="styledRow">
            <ion-col>
              <button ion-button icon-left color="#f4f4f4" clear small>
                <ion-icon name="calendar"></ion-icon>
                <div>Platnosť: {{c.getExpiration}}</div>
              </button>
            </ion-col>
          </ion-row>
          <div text-right="" class="styledRow">
            <ion-note>Refreshed: 12.3.2017
            </ion-note>
          </div>
      </ion-card>
    </ion-item>
  </ion-list>

这是我的打字稿：

export class HomePage {
  card: permCard[];

  constructor(public navCtrl: NavController) {
    this.card = new Array();
    for (let i = 0; i < 2; i++){
      this.card.push(new permCard("Name","Name", 33, 40, " "+"days", "12.2.2017"));
    }
  }
}

export class permCard{
  private centerName: string;
  private permName: string;
  private permValue: number;
  private totalValue: number;
  private dayEuro: string;
  private expiration: string;

  constructor(public center_name: string, public perm_name: string, public perm_value: number, public total_value: number,
          public day_euro: string, public expiration_date: string){
    this.centerName = center_name;
    this.permName = perm_name;
    this.permValue = perm_value;
    this.totalValue = total_value;
    this.dayEuro = day_euro;
    this.expiration = expiration_date;
  }
  get getCenterName(): string {
    return this.centerName;
  }
  get getPermValue(): number {
    return this.permValue;
  }
  get getPermName(): string {
    return this.permName;
  }
  get getTotalValue(): number {
    return this.totalValue;
  }
  get getDayEuro(): string {
    return this.dayEuro;
  }
  get getExpiration(): string {
    return this.expiration;
  }
}

我不知道，问题是否出在数组中，但只有 array.push 对我进行了数组初始化。请问，你有什么想法，应该是什么问题。 TypeScript 和 Angular 对我来说是新的，谢谢。

Answer 1

如何使用 ng-repeat 访问数组中的对象

你不能。 ng-repeat 是 angularjs（版本 1）语法。 Ionic 2 建立在 angular 2 之上。

模板中for循环的格式为：

<ion-item *ngFor="let c of card">
        <ion-card class="styledRow">
  <!-- shortened for brevity -->
</ion-item>

文档ngFor