Fetch a doc from pouchdb


#1

I am using pouchdb and couchdb to save and fetch records. I have a page that shows a list of all the records’ name and age using modal component. I want to click one of the records - open a corresponding page/modal to show more information the record has.

Ex. List fetched from pouchdb has 3 names and age - John 31, Anita 23, and Marco 19. When Marco is clicked, a modal opens displaying his name, age, and 2 buttons named Address and Status (to open another modal). When Address button is clicked, should open another modal displaying his full address that is fetched from pouchdb. All information is saved in pouchdb.

How do I fetch specific record from pouchdb to display on specific user profiles?

Update: Here is my current code.

main.html - Page to show list of names and age.

<ion-item-sliding *ngFor="let person of persons">

  <ion-item (click)="openModal(person)">
  {{ person.profile_name}}
  <p>
    Age: {{ person.profile_age }}
  </p>
  </ion-item>

</ion-item-sliding>

main.ts
ionViewDidLoad() {
console.log(‘ionViewDidLoad ProfilePage’);
this.dbProvider.read().then((data) => {
this.persons = data;
});
}

ionViewDidEnter() {
this.dbProvider.read();
}

openModal(person) {
let modal = this.modalCtrl.create(InfoPage, person);
modal.present();
}

info.html - modal page with name, age, and 2 buttons

<ion-item-sliding *ngFor="let person of persons">
  {{ person.profile_name}}
  <p>
    Age: {{ person.profile_age }}
  </p>
  </ion-item>

<ion-item>
  <button ion-item (click)="AddressPage()">Address</button>
  <button ion-item (click)="StatusPage()">Status</button>
</ion-item>

info.ts
ionViewDidLoad() {
console.log(‘ionViewDidLoad InfoPage’);
this.dbProvider.read().then((data) => {
this.persons = data;
});
}

ionViewDidEnter() {
this.databaseProvider.read(this.person, this.infos);
}

AddressPage(infos) {
let modal = this.modalCtrl.create(AddressPage, infos);
modal.present();
}

StatusPage(infos) {
let modal = this.modalCtrl.create(StatusPage, infos);
modal.present();
}

address.html
<ion-item *ngFor=“let info of infos”>
Address
Address1: {{info.profile_address}}

address.ts
ionViewDidLoad() {
console.log(‘ionViewDidLoad AddressPage’);
this.dbProvider.read().then((data) => {
this.infos = data;
});
}

ionViewDidEnter() {
this.dbProvider.read();
}


#2

Can you share your current code implementation please?


#3

Thank you, just updated with the current code.