从沙发数据库检索数据



.我正在开发一个使用 ionic 2 的应用程序。我在 couchdb 中有关于 9 个不同项目的数据。如何显示与单击的项目对应的数据库中的每个数据。项目在列表中?

这是提供者诊断。

   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>

我不确定你想要什么。如果您需要显示单击的项目,您必须做的是添加(单击(事件,在该事件中调用发送该项目的函数(再次,我不知道您是否在问这个(...

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

相关内容

  • 没有找到相关文章

最新更新