0
am新しいionic 2 angular developmentについて私は連絡先のようなアルファベット順インデックスリストを作成したいのですがどのように実現するのですか?これは、TSページですイオン2のアルファベットインデックスリストの作成方法は?
<ion-header>
<ion-navbar color="secondary">
<ion-title>Contract</ion-title>
</ion-navbar>
</ion-header>
<ion-content >
<ion-list *ngFor="let contracts of contractlist ; let i = index;">
<ion-card >
<ion-item (click)="onClickContract($event,contracts)">
<h2> {{contracts.HeaderText}}</h2>
<p>{{contracts.SubText}}</p>
<p item-right >{{contracts.ApprovalCount}}</p>
</ion-item>
</ion-card>
</ion-list>
</ion-content>
:これまでのところ、これは私のhtmlページで私がしようとしているものを投稿してみましょう
import { Component } from '@angular/core';
import { Events, NavController, NavParams, LoadingController } from 'ionic-angular';
import { ContractService } from '../../services/contract.service';
import { ViewPage } from '../view/view';
@Component({
selector: 'page-home',
templateUrl: 'home.html',
})
export class HomePage {
private contractlist:any;
result: any;
constructor( public contractservice: ContractService
,public navCtrl: NavController,
) {
this.loadcontract();
}
loadcontract() {
this.contractservice.readContract().then(data => {
this.result = data;
this.contractlist = this.result;
});
}
onClickContract(event,contracts) {
this.navCtrl.push(ViewPage, { contracts: contracts });
}
}
私はWebサービスからの私のJSON形式のデータをフェッチしています
[{"Header":"Contract","Name":"Bal"},{"Header":"Stores","Name":"store pre"},{"Header":"Contract","Name":"Balls"},{"Header":"Stores","Name":"Tyoe"},{"Header":"Incident":"Name":"df"}]
これはサーバーから取得しているJson形式です。
これは私のリストは以下のようになります方法です:事前に
Contract
--bal
--balls
Stores
--store pre
--tyoe
Incident
--df
感謝!!