hi
i need you help
i show you all of my project and after i explain you
my first page
home.html
<ion-header>
<ion-toolbar color="primary">
<button ion-button menuToggle >
<ion-icon name="menu"></ion-icon>
</button>
<ion-title align="center">Home</ion-title>
<ion-buttons end>
<button ion-button icon-only (click)="launchSearchBar()">
<ion-icon ios="ios-search" md="md-search"></ion-icon>
</button>
<button ion-button icon-only color="royal">
<ion-icon ios="ios-funnel" md="md-funnel"></ion-icon>
</button>
</ion-buttons>
</ion-toolbar>
</ion-header>
<ion-content class="card-background-page" (click)="presentLoading()" (click)="launchCatpagePage()" >
<ion-refresher (ionRefresh)="doRefresh($event)">
<ion-refresher-content
pullingIcon="arrow-dropdown"
pullingText="Pull to refresh"
refreshingSpinner="circles"
refreshingText="Refreshing...">
</ion-refresher-content>
</ion-refresher>
<div *ngFor="let villeList of Ville | async">
<ion-card>
<img src="./img/Ville/{{villeList.images}}"/>
<div class="card-title">{{villeList.ville}}</div>
</ion-card>
</div>
</ion-content>
home.ts :
import { Component } from '@angular/core';
import { NavController } from 'ionic-angular';
import { SouscatPage } from '../souscat/souscat';
import { PostbuisnessPage } from '../postbuisness/postbuisness';
import { CatpagePage } from '../catpage/catpage';
import { AngularFire, FirebaseListObservable } from 'angularfire2';
import { LoadingController } from 'ionic-angular';
@Component({
selector: 'page-home',
templateUrl: 'home.html'
})
export class HomePage {
Ville: FirebaseListObservable<any>;
constructor(public navCtrl: NavController,angFire: AngularFire,public loadingCtrl: LoadingController)
{
this.Ville = angFire.database.list('/Ville');
}
launchCatpagePage(){
this.navCtrl.push(CatpagePage,);
}
presentLoading() {
this.loadingCtrl.create({
content: 'Veuillez patientez...',
duration: 10,
dismissOnPageChange: false
}).present();
}
doRefresh(refresher) {
console.log('Begin async operation', refresher);
setTimeout(() => {
console.log('Async operation has ended');
refresher.complete();
}, 2000);
}
}
my app content :
import { NgModule, ErrorHandler } from '@angular/core';
import { IonicApp, IonicModule, IonicErrorHandler } from 'ionic-angular';
import { MyApp } from './app.component';
import { HomePage } from '../pages/home/home';
import { SouscatPage } from '../pages/souscat/souscat';
import { PostbuisnessPage } from '../pages/postbuisness/postbuisness';
import { CatpagePage } from '../pages/catpage/catpage';
import { DynamicComponentModule } from 'ng-dynamic';
import { AngularFireModule } from 'angularfire2';
import { NavController } from 'ionic-angular';
import { EmailComposer } from 'ionic-native';
import { ListeCPage } from '../pages/liste-c/liste-c';
export const firebaseConfig = {
// Initialize Firebase
apiKey: "***********************************************",
authDomain: "**********************************************",
databaseURL: "******************************************",
storageBucket: "***************************************",
messagingSenderId: "********************"
}
@NgModule({
declarations: [
MyApp,
HomePage,
SouscatPage,
PostbuisnessPage,
CatpagePage,
ListeCPage
],
imports: [
IonicModule.forRoot(MyApp),
DynamicComponentModule,
AngularFireModule.initializeApp(firebaseConfig)
],
bootstrap: [IonicApp],
entryComponents: [
MyApp,
HomePage,
SouscatPage,
PostbuisnessPage,
CatpagePage,
ListeCPage
],
providers: [{provide: ErrorHandler, useClass: IonicErrorHandler}]
})
export class AppModule {
}
and this is my second page .html
<ion-header>
<ion-navbar color="primary">
<ion-title align="center">
Categorie
</ion-title>
<ion-buttons end>
<button ion-button icon-only (click)="launchHomePage()">
<ion-icon name="home"></ion-icon>
</button>
</ion-buttons>
</ion-navbar>
</ion-header>
<ion-content class="card-background-page" (click)="presentLoading()" (click)="launchSouscatPage()">
<ion-refresher (ionRefresh)="doRefresh($event)">
<ion-refresher-content
pullingIcon="arrow-dropdown"
pullingText="Pull to refresh"
refreshingSpinner="circles"
refreshingText="Refreshing...">
</ion-refresher-content>
</ion-refresher>
<div *ngFor="let cat of Cat | async ">
<ion-card>
<img src="./img/Categorie/{{cat.image}}"/>
<div class="card-title">{{cat.nomCat}}</div>
</ion-card>
</div>
</ion-content>
secondPage.ts
import { Component } from '@angular/core';
import { NavController, NavParams } from 'ionic-angular';
import { AngularFire, FirebaseListObservable } from 'angularfire2';
import { SouscatPage } from '../souscat/souscat';
import { HomePage } from '../home/home';
import { LoadingController } from 'ionic-angular';
/*
Generated class for the Catpage page.
See http://ionicframework.com/docs/v2/components/#navigation for more info on
Ionic pages and navigation.
*/
@Component({
selector: 'page-catpage',
templateUrl: 'catpage.html'
})
export class CatpagePage {
Cat: FirebaseListObservable<any>;
constructor(public navCtrl: NavController,angFire: AngularFire,public loadingCtrl: LoadingController)
{
this.Cat = angFire.database.list('/Cat');
}
launchSouscatPage(){
this.navCtrl.push(SouscatPage);
}
launchHomePage(){
this.navCtrl.push(HomePage);
}
presentLoading() {
this.loadingCtrl.create({
content: 'Veuillez patientez...',
duration: 14,
dismissOnPageChange: false
}).present();
}
doRefresh(refresher) {
console.log('Begin async operation', refresher);
setTimeout(() => {
console.log('Async operation has ended');
refresher.complete();
}, 2000);
}
}
i want passing data between 2 page
the home contain the city and after i push the city different category come after you click on category , the list of company come filter by city but i dont now how can be push data filtered in my page of list company
for a better comprehension this is a screen of my app and different page
City
Category
subcategory
detail list filtered by city -category - subcategory
thank for you help
ps: sorry for my english im french