検索バーイオン2つの

Question

おかげで再び友人の@amin、行くことができます、私はStates.htmlで次の操作を行います。このリストで

<ion-col col-6 col-sm-9 col-md-6 col-lg-4 col-xl-3 id="states" *ngFor="let state of states"> 
    <a (click)="navigateTo(state)"> 
    <h5><strong>States</strong></h5> 
    <h4><strong>{{ states.name }}</strong></h4> 
    </a> 
</ion-col> 

は、私は大丈夫states.tsにオブジェクトの状態を取得します！ここで

navigateTo(state) { 
    this.navCtrl.push(CityComponent, { 
    state: state 
}); 

}

、私は、

export class CitiesComponent { 
    state: any; 
    searchQuery: string = ''; 
    cities: any[]; 

    constructor(public navParams: NavParams, public navCtrl: NavController, public service: ServiceProvider) { 
    this.state = navParams.get('state'); 
    this.initializeCities(); 
    } 

    initializeCities() { 
    this.service.getCities() 
     .subscribe(
     data => this.cities = data, 
     err => console.log(err) 
    ); 
    } 

    getNameCities(eve: any) { 
    this.initializeCities(); 
    let val = eve.target.value; 
    if(val && val.trim() != '') { 
     this.cities = this.cities.filter((city: any) => { 
     if (city.name.toLowerCase().indexOf(val.toLowerCase()) > -1) 
     return true; 
      else 
      return false; 
     }) 
    } 
    } 
} 

OK CitiesComponents.tsを見て、私は件のデータを取得し、一つのサービス・プロバイダを持っているIDと名前と

た状態オブジェクトを取得します

ここで私はサービスプロバイダーからのデータを取得し、私のhtmlですべて表示しますが、これはどのように都市のid_stateにid州を渡すのでしょうか？私はこれを私のapiに置くか、ここでid_stateを渡します、もし私がここで行うなら、id_state = idを実行し、州から関連する都市を表示する場所？

<ion-searchbar [(ngModel)]="search" placeholder="search" (ionInput)="getItems($event)"></ion-searchbar> 
<ion-list> 
    <ion-list-header> 
     header 
    </ion-list-header> 
    <button ion-item *ngFor="let state of states" (click)="itemTapped($event, state)"> 
     <h2>{{state.name}}</h2> 
    </button> 
</ion-list> 

TSファイル：最初のページで

Answer 1

あなたは

htmlファイルを必要とする第2ページのhtmlで

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

//component 
import { CityPage } from '../city/city'; 

@Component({ 
    selector: 'message-list', 
    templateUrl: 'message-list.html', 
    providers: [MessageService] 
}) 
export class StatePage { 

constructor(
    public navController: NavController, 
    public navParams: NavParams 
) {} 

states; 
search; 

ionViewWillEnter() { 
    //get the states 
    this.states = states; 
} 

getItems() { 
    //search the state with this.search 
    this.states = searched_states; 
} 

itemTapped(event, statet) { 
    this.navController.push(CityPage, { 
     state: state 
    }); 
} 
} 

は、最初のページのようですが、あなたのような選択された状態を得ることができますこの：

ngOnInit() { 
    this.selected_state= this.navParams.get('state'); 
    //then loade the cities with selected state 
}