从couchdb中检索数据

时间:2017-03-21 08:00:52

标签: ionic2

。正在使用离子2处理应用程序。我在couchdb中有大约9个不同项目的数据。如何显示与单击的项目对应的数据库中的每个数据。这些项目在列表中?

这是提供者 diagnosis.ts

   import { Injectable } from '@angular/core';
    import PouchDB from 'pouchdb';

    @Injectable()
    export class Diagnosis{


    data: any;
    db: any;
    remote: any;

    constructor() {
    this.db = new PouchDB('ezy');

    this.remote = 'http://localhost:5984/ezy';


    let options = {
      live: true,
      retry: true,
      continuous: true
    };

    this.db.sync(this.remote, options);

     }



    getTodos() {
    if (this.data) {
      return Promise.resolve(this.data);
    }

    return new Promise(resolve => {

      this.db.allDocs({

        include_docs: true

      }).then((result) => {

        this.data = [];

        let docs = result.rows.map((row) => {
          this.data.push(row.doc);
        });

        resolve(this.data);

        this.db.changes({live: true, since: 'now', include_docs: true}).on('change', (change) => {
          this.handleChange(change);
        });

      }).catch((error) => {

        console.log(error);

      });

    });

  }

  createTodo(todo){
    this.db.post(todo);
  }
  getTodo(todo){
    this.db.get(todo);
  }
  updateTodo(todo){
    this.db.put(todo).catch((err) => {
      console.log(err);
    });
  }

  deleteTodo(todo){
    this.db.remove(todo).catch((err) => {
      console.log(err);
    });
  }


  handleChange(change){
    let changedDoc = null;
    let changedIndex = null;

    this.data.forEach((doc, index) => {

      if(doc._id === change.id){
        changedDoc = doc;
        changedIndex = index;
      }

    });

    //A document was deleted
    if(change.deleted){
      this.data.splice(changedIndex, 1);
    }
    else {

      //A document was updated
      if(changedDoc){
        this.data[changedIndex] = change.doc;
      }

      //A document was added
      else {
        this.data.push(change.doc);
      }

    }
  }

}

提供者使用情况如下 的 .TS

 constructor(public navCtrl: NavController, public navParams: NavParams,public diagnose:Diagnosis) {
    this.pet = "puppies";
    console.log(diagnose.getTodos());
    diagnose.getTodos().then(result=>{
      this.pest = result;
      console.log(result);
    })
  }

html的

 <ion-grid>
        <ion-row>
          <ion-col *ngFor="let val of pest" width-100>
            <ion-list>
              <ion-item><h3>{{val.name}}</h3></ion-item>
              <ion-item><h3>{{val.description}}</h3></ion-item>
              <ion-item><h3>{{val.disease}}</h3></ion-item>
              <ion-item><h3>{{val.prevention}}</h3></ion-item>
            </ion-list>
          </ion-col>
        </ion-row>
      </ion-grid>

1 个答案:

答案 0 :(得分:1)

我不确定你想要什么..如果你需要显示点击的项目,你需要做的是添加(点击)事件,你调用发送项目的功能(再次,我不要知道你是否在问这个... ...

<ion-item (click)="viewItem(val.prevention)"><h3>{{val.prevention}}</h3></ion-item>