i am using ionic 2.I am facing lots of problem in ionic 2. When i navigate push to show the data. At first time its works fine. After that its printing the data in console. But not showing in screen.
And also in terminal, when i do some changes in .ts,.html,.scss file.Its not updating . I need to close my terminal and again i need to do ionic serve --lab.. so is there any change the .ts file to .js. And if yes, does the syntax i need to change any thing inside new .js file.
Thanks, sathish
Update :
I have home screen and by push i am passing the cat id to pupulate the data in my settings.html based on the cat id that i am passing from home.html:
my home.html
<div class="item item-body no-padding" style="border-width: 0px !important;">
<div class="row no-padding" *ngFor="let data of Catdata;let i = index" (click)="showDetails(Catdata[i].CatID)">
<ng-container *ngIf=" i % 2 === 0">
<div class="col col-50 custom-design2" style="background: url(img url) no-repeat center;background-size: cover;">
<div class="custom-design1"><span class="grid-title">{{Catdata[i].CategoryName}}</span></div>
</div>
<div class="col col-50 custom-design2" style="background: url(img url) no-repeat center;background-size: cover;">
<div class="custom-design1"><span class="grid-title">{{Catdata[i+1].CategoryName}}</span></div>
</div>
</ng-container>
</div>
</div>
my home.ts:
data: any;
Catdata: any;
constructor( public alertCtrl: AlertController,
public modalCtrl: ModalController,
public navCtrl: NavController,
public http:Http,
public authService: AuthService) {
this.submit();
}
submit() {
this.authService.categ(this.loginData).then((result) => {
this.data = result;
if(this.data.status == 1)
{
this.Catdata = this.data.CatgeoryList;
for(let i=0; i<this.Catdata.length; i++) {
console.log(this.Catdata[i].CategoryName);
}
}
else if(this.data.status == 0) {
let alert = this.alertCtrl.create({
title: 'Error',
subTitle: 'Please Enter Valid Username & Password',
buttons: ['OK']
});
alert.present();
}
}, (err) => {
});
}
public showDetails(catId: any): void {
this.navCtrl.push(SettingsPage, { clickedcatId: catId });
}
My settings.html:
<div class="item item-body no-padding" style="border-width: 0px !important;">
<div class="row no-padding" *ngFor="let data of Catdata;let i = index" (click)="opndetailpage()">
<ng-container *ngIf=" i % 2 === 0">
<div class="col col-50 custom-design2" style="background: url(img url) no-repeat center;background-size: cover;">
<div class="custom-design1"><span class="grid-title">{{data[i].SubCategoryName}}</span></div>
</div>
<div class="col col-50 custom-design2" style="background: url(img url) no-repeat center;background-size: cover;">
<div class="custom-design1"><span class="grid-title">{{data[i+1].SubCategoryName}}</span></div>
</div>
</ng-container>
</div>
</div>
my settings.ts
data: any;
Catdata: any;
constructor( public alertCtrl: AlertController,
public modalCtrl: ModalController,
public navCtrl: NavController,
public http:Http,
public authService: AuthService,private navParams: NavParams) {
this.categoryid = navParams.get('clickedcatId');
console.log(this.categoryid);
this.another();
}
another() {
this.subcatdata = { CatID:this.categoryid};
this.authService.subcatte(this.subcatdata).then((result) => {
this.data = result;
console.log (this.data);
if(this.data.status == 1)
{
this.Catdata = this.data.SubCatgeoryList;
for(let i=0; i<this.Catdata.length; i++) {
console.log(this.Catdata[i].SubCategoryName);
}
}
else if(this.data.status == 0) {
let alert = this.alertCtrl.create({
title: 'Error',
subTitle: 'Please Enter Valid Username & Password',
buttons: ['OK']
});
alert.present();
}
}, (err) => {
});
}
My authservice.ts
This is fine:
categ(cat: any) {
return new Promise((resolve, reject) => {
let headers = new Headers();
headers.append('Content-Type', 'application/json');
this.http.post(apiUrl+'categories.php', JSON.stringify(cat), {headers: headers})
.subscribe(res => {
resolve(res.json());
}, (err) => {
reject(err);
});
});
}
subcatte(subcat: any) {
return new Promise((resolve, reject) => {
let headers = new Headers();
headers.append('Content-Type', 'application/json');
this.http.post(apiUrl+'subcategory.php', JSON.stringify(subcat), {headers: headers})
.subscribe(res => {
resolve(res.json());
}, (err) => {
reject(err);
});
});
}
