Question

我的离子项目中有动态卡片，我想为不同的卡片添加动态图像。

这是我的.html代码：

<ion-header>
  <ion-navbar>
    <button ion-button menuToggle>
      <ion-icon name="menu"></ion-icon>
    </button>
    <ion-title *ngFor="let file_uri of row"><p>{{file-uri.name}}</p></ion-title>
  </ion-navbar>
</ion-header>

<ion-content class="cards-bg social-cards">
  <ion-card *ngFor="let uri of card">
    <p ion-button color="light" clear>{{uri.myurl}}hi</p>
    <ion-item (click)="OpenContentPage()">
      <ion-avatar item-start>
        <img src="{{uri.myurl}}">
        <p>{{uri.myurl}}</p>
      </ion-avatar>
      <h2>Marty McFly</h2>
      <p>November 5, 1955</p>
    </ion-item>

    <img src="{{uri.myurl}}" (click)="OpenContentPage()">

    <ion-card-content (click)="OpenContentPage()">
      <p>hello</p>
    </ion-card-content>
  </ion-card>
</ion-content>

这是我的.ts代码：

card: Array<any>; //array of arrays
constructor(public nav: NavController, public navParams: NavParams) {

  var temp1 = [{myurl: 'assets/img/advance-card-bttf.png', code: 'i am gandhar'},
];

  //console.log(this.navParams.get("temp1"));
  this.card = [];
  this.card.push(temp1);
  this.card.push(temp1);
  console.log(this.card);

}

它给了我动态卡片，但它没有显示来自对象的图像和数据。

有人可以帮忙吗？

Answer 1

删除此括号[]，它将显示图像和数据。试试这样：

var temp1 = {myurl: 'assets/img/advance-card-bttf.png', code: 'i am gandhar'};

我想在卡片中添加离子动态图像

1 个答案: