สร้างตัวแปร contacts
เป็นชนิด any[]
นำมาแสดงผลเป็น list
แบบ item
และแบบ button
โดยแบบ item
จะ click ไม่ได้
และแบบ button
จะ click ได้
แก้ไขไฟล์ src/pages/home/home.ts
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 |
import { Component } from '@angular/core'; import { NavController } from 'ionic-angular'; @Component({ selector: 'page-home', templateUrl: 'home.html' }) export class HomePage { contacts: any[]; constructor(public navCtrl: NavController) { this.contacts = [ { title: 'AAA', contact: '111' }, { title: 'BBB', contact: '222' }, { title: 'CCC', contact: '333' }, { title: 'DDD', contact: '444' } ] } showContact(contact) { alert(contact.title); } } |
ตัวแปร contacts
เป็นชนิด any[]
แก้ไขไฟล์ src/pages/home/home.html
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 |
<ion-header> <ion-navbar> <ion-title> Ionic Blank </ion-title> </ion-navbar> </ion-header> <ion-content padding> <ion-list> <ion-item *ngFor="let contact of contacts"> {{contact.title}} {{contact.contact}} </ion-item> </ion-list> <ion-list> <button (click)="showContact(contact)" ion-item *ngFor="let contact of contacts"> {{contact.title}} {{contact.contact}} </button> </ion-list> </ion-content> |