Question

我是离子2中的新手。我创建了一个数组然后我想将数组循环到ion-list

我的produk.ts

import { Component } from '@angular/core';
import { NavController, NavParams } from 'ionic-angular';


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



  constructor(public navCtrl: NavController, public navParams: NavParams) {
    var menu: any[] = [
      "menu 1",
      "menu 2",
      "menu 3"
    ];
  }

}

我在我的html中尝试使用此代码，但它不起作用

<ion-content padding>

  <ion-list>
    <ion-item *ngfor = "let item of menu;">
     {{menu}}
    </ion-item>  
  </ion-list>

</ion-content>

Answer 1

menu需要是一个类变量才能实现。

export class ProdukPage {
 menu:any[]=[]; //initialize to empty list to avoid undefined/null errors for `menu` in the template.
  constructor(public navCtrl: NavController, public navParams: NavParams) {
    this.menu = [
      "menu 1",
      "menu 2",
      "menu 3"
    ];
  }
}

Answer 2

您应该定义类变量。

import { Component } from '@angular/core';
import { NavController, NavParams } from 'ionic-angular';


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

   menu: any[];

  constructor(public navCtrl: NavController, public navParams: NavParams) {
    this.menu: any[] = [
      "menu 1",
      "menu 2",
      "menu 3"
    ];
  }

}

* ngfor离子列表中的离子列表

2 个答案: