#angular #ionic4
#angular #ionic4
Вопрос:
Я пытаюсь создать приложение ionic 4 с базовым CRUD в серверной части, используя PHP. Пока все хорошо. Я успешно вставил новые данные через серверную часть в базу данных MariaDB / MySQL. Моя проблема в том, что компонент ionic page не обновляется автоматически после вставки данных в базу данных. Я не знаю почему. Я пытался найти решение в Интернете, но, похоже, ничего не работает. Я прочитал ‘ChangeDetectorRef’ и уже внедрил его в свой метод insert, но он также не работает. Это меня действительно смущает. Я должен очистить перезагрузку кэша с помощью ctrl shift R
в Chrome, чтобы видеть изменения данных каждый раз, когда я выполняю вставку. То же самое с devapp. Похоже, что проблемы с кешем браузера, поэтому я создаю приложение и смотрю, осталось ли оно таким же, и результат остался тем же даже после того, как я создал приложение. Я не вижу изменений данных после вставки. Почему компонент страницы не обновляется автоматически после вставки в базу данных. Пожалуйста, помогите кому-нибудь.
add-data-page.ts
//add-data-page.ts
async presentAlert(title,message) {
const alert = await this.ac.create({
header: title,
message: message,
buttons: ['OK']
});
alert.onDidDismiss().then(()=>{
this.router.navigate(['/home']);
});
await alert.present();
}
saveData(){
this.presentLoading("Loading").then(()=>{
this.dk.insertData(this.mydata).subscribe((result:any)=>{
this.lc.dismiss();
this.changeRef.detectChanges();
this.presentAlert("Succes","New data added");
console.log(result);
},_error=>{
this.lc.dismiss();
});
});
data.service.ts
// get data from database
getDataRest():Observable<any>{
return this.http.get(this.configUrl).pipe(
map(result=>{
console.log(result);
return resu<
})
);
}
getDetail(id:any){
return this.http.get(this.configUrl '?paramId=' id);
}
insertData(data:IDataku):Observable<any>{
return this.http.post(this.configUrl '?ins=true',data);
}
Домашняя страница для отображения данных
export class HomePage implements OnInit{
result: Observable<IDataku[]>;
constructor(private dk: DatakuService){}
ngOnInit(){
this.result = this.dk.getDataRest();
}
}
Комментарии:
1. можете ли вы загрузить HTML-файл своей домашней страницы
2. вот HTML-файл моей домашней страницы
<ion-list> <ion-item no-margin [routerLink]="['/home',item.id]" *ngFor="let item of (result | async)"> <ion-label text-capitalize>{{item.name}}</ion-label> </ion-item> </ion-list>
3. Я думаю, что после того, как вы закроете страницу добавления данных, вам следует снова прочитать данные.
4. Я не уверен. Не могли бы вы сказать мне, как именно мне снова прочитать данные в ionic 4?
5. Вот что я делаю после того, как данные были вставлены :
async presentAlert(title,message) { const alert = await this.ac.create({ header: title, message: message, buttons: ['OK'] }); alert.onDidDismiss().then(()=>{ this.router.navigate(['/home']); }); await alert.present(); }
Ответ №1:
Попробуйте это
export class HomePage implements OnInit{
resu<
constructor(private dk: DatakuService){}
ngOnInit(){
this.dk.getDataRest().subscribe(data => {
this.result= data;
});
}
}