私はApache Cordova、ionic 2を使ってアプリケーションを開発しています。私はCouchbase Liteをモバイルのローカルストレージに使いたいと思います。私は、データを格納することができると思います。しかし、私はデータを取得することができません。私は、リンクhttps://blog.couchbase.com/2016/december/data-synchronization-with-couchbase-in-ionic-2-hybrid-mobile-appsで与えられた例を使って、Couchbaseローカルデータベースで読み書き操作を実行しました。上記プログラムcreateAgentでcordova、ionic 2を使用して開発されたアプリでcouchbase Liteからデータを取得するには?
import { Component, NgZone } from '@angular/core';
import { NavController, AlertController } from 'ionic-angular';
import { CouchbaseProvider } from "../../app/couchbase-provider";
import { Toast } from 'ionic-native';
import "rxjs/add/operator/map";
@Component({
selector: 'CreateAgent',
templateUrl: 'CreateAgent.html'
})
export class CreateAgent {
// declare the variables to hold the values
firstName: string = "";
lastName: string = "";
dateofBirth: any = new Date().toISOString();
aadharNumber: number;
panNumber: string = "";
eMail: any;
userName: string="";
mobileNumber: number;
password: any;
confPassword: any;
public items: Array<any>;
// constructor
constructor(public navCtrl: NavController, public alertCtrl: AlertController, public couchbase: CouchbaseProvider, public zone: NgZone)
{
this.items = [];
}
createAgent()
{
let userdetails = {
"type":"agentdetails",
"firstName": this.firstName,
"lastName": this.lastName,
"dateofBirth": this.dateofBirth,
"aadharNumber":this.aadharNumber,
"panNumber":this.panNumber,
"mobileNumber":this.mobileNumber,
"userName":this.userName,
"password":this.password,
"confPassword":this.confPassword
};
this.couchbase.getDatabase().createDocument(userdetails).then((result:any)=>{
Toast.show("Agent account created.", '6000', 'center').subscribe(
toast => {
console.log(toast);
});
},errors=>
{
Toast.show("Failed to create an account for the user.", 'long', 'center').subscribe(
toast => {
console.log(toast);
});
});
}
public showAgents() {
Toast.show("In the show method...", 'long', 'center').subscribe(
toast => {
console.log(toast);
});
setTimeout(() => {
this.couchbase.getChangeListener().subscribe(data => {
for (let i = 0; i < data.length; i++) {
if (!data[i].hasOwnProperty("deleted") && data[i].id.indexOf("_design") === -1) {
this.couchbase.getDatabase().getDocument(data[i].id).then((result: any) => {
if (result.type === "agentdetails") {
this.zone.run(() => {
this.items.push(result);
Toast.show("In the show method..."+result.type, 'long', 'center').subscribe(
toast => {
console.log(toast);
});
});
}
});
}
}
});
}, 100);
this.couchbase.getDatabase().queryView("_design/todo", "items", {}).then((result: any) => {
this.items = [];
for (var i = 0; i < result.rows.length; i++) {
this.items.push(result.rows[i].value);
Toast.show("In the query view..."+result.type, 'long', 'center').subscribe(
toast => {
console.log(toast);
});
}
Toast.show("Values:"+result.rows[0].value, 'long', 'center').subscribe(
toast => {
console.log(toast);
});
}, error => {
console.error("ERROR: " + JSON.stringify(error));
Toast.show("Error"+JSON.stringify(error), 'long', 'center').subscribe(
toast => {
console.log(toast);
});
});
}
}
()メソッドは、データベースへのエージェントの詳細を追加するために使用される:続い
はCreateAgent.tsのコードです。 showAgents()メソッドは、作成されたエージェントの詳細を表示するために使用されます。 CreateAgent.htmlの
コード:
<ion-header>
<ion-navbar color ="secondary">
<button ion-button menuToggle>
<ion-icon name="menu"></ion-icon>
</button>
<ion-title>Net Zone</ion-title>
</ion-navbar>
</ion-header>
<ion-content padding>
<h3>Create Agent</h3>
<ion-list>
<!--Input box to read the first name the user -->
<ion-item>
<ion-label floating>First Name*</ion-label>
<ion-input type="text" [(ngModel)]="firstName"></ion-input>
</ion-item>
<!--Input box to read the last name the user -->
<ion-item>
<ion-label floating>Last Name</ion-label>
<ion-input type="text" [(ngModel)]="lastName"></ion-input>
</ion-item>
<!--Read the date of birth from the user -->
<ion-item>
<ion-label floating>Date of Birth</ion-label>
<ion-datetime displayFormat="DD-MMM-YYYY" pickerFormat="DD-MMM-YYYY" [(ngModel)]="dateofBirth"></ion-datetime>
</ion-item>
<!--Input box to read the Aadhar number of the user -->
<ion-item>
<ion-label floating>Aadhar Number</ion-label>
<ion-input type="number" [(ngModel)]="aadharNumber"></ion-input>
</ion-item>
<!--Input box to read the PAN number of the user -->
<ion-item>
<ion-label floating>PAN Number</ion-label>
<ion-input type="text" [(ngModel)]="panNumber"></ion-input>
</ion-item>
<!--Input box to read the email address of the user -->
<ion-item>
<ion-label floating>Email</ion-label>
<ion-input type="mail" [(ngModel)]="eMail"></ion-input>
</ion-item>
<!--Input box to choose the username for the user -->
<ion-item>
<ion-label floating>Choose your Username</ion-label>
<ion-input type="text" [(ngModel)]="userName"></ion-input>
</ion-item>
<!--Input box to read the mobile number of the user -->
<ion-item>
<ion-label floating>Mobile Number</ion-label>
<ion-input type="number" [(ngModel)]="mobileNumber"></ion-input>
</ion-item>
<!--Input box to prompt the user to enter password -->
<ion-item>
<ion-label floating>Create Password</ion-label>
<ion-input type="password" [(ngModel)]="password"></ion-input>
</ion-item>
<!--Input box to prompt the user to enter password -->
<ion-item>
<ion-label floating>Confirm your Password</ion-label>
<ion-input type="password" [(ngModel)]="confPassword"></ion-input>
</ion-item>
<!--Add button to create the account for the user-->
<button ion-button secondary (click)="createAgent()">Create User Account</button>
<button ion-button secondary (click)="showAgents()">Show Agents</button>
<ion-item>
<ion-label>Agent's Details</ion-label>
</ion-item>
<ion-item *ngFor="let item of items">
{{ item.firstName }}
</ion-item>
</ion-list>
</ion-content>
しかし、私のコードは、ローカル・データベースからデータを取得されていません。 問題の修正にお役立てください。私はあなたのすべての助けに感謝します。
(編集:追加のコードを追加) Couchbaseの-provider.tsコード:
import { Injectable, EventEmitter } from '@angular/core';
import { Http } from '@angular/http';
import { Platform } from 'ionic-angular';
import { Couchbase, Database } from "cordova-couchbase/core";
import 'rxjs/add/operator/map';
declare var emit: any;
@Injectable()
export class CouchbaseProvider {
private isInstantiated: boolean;
private database: Database;
private listener: EventEmitter<any> = new EventEmitter();
public constructor(public http: Http, platform: Platform) {
if(!this.isInstantiated) {
platform.ready().then(() => {
(new Couchbase()).openDatabase("netzone").then(database => {
this.database = database;
let views = {
items: {
map: function(doc) {
if(doc.type == "list" && doc.title) {
emit(doc._id, {title: doc.title, rev: doc._rev})
}
}.toString()
}
};
this.database.createDesignDocument("_design/todo", views);
this.database.listen(change => {
this.listener.emit(change.detail);
});
this.database.sync("http://127.0.0.1:4984/_admin", true);
this.isInstantiated = true;
}, error => {
console.error(error);
});
});
}
}
public getDatabase() {
return this.database;
}
public getChangeListener(): EventEmitter<any> {
return this.listener;
}
public fetch() {
return this.database.getAllDocuments.toString();
}
}
あなたは 'couchbaseProvider'コードを追加できますか? –
@suraj:couchbase-provider.tsコードを追加しました。チェックしてください。 –
ログには何か? –