angular - Ionic Storage Niet gedefinieerd voor Array van Objecten
Ik heb moeite om een array van objecten te krijgen die ik van mijn Parse Server heb opgehaald, maar tot nu toe zonder succes.
Ik ben de app aan het bouwen met Ionic 3 en Ionic Storage. Het lijkt erop dat ik een belofte in plaats van een waarde heb gekregen, maar ik heb alles geprobeerd om het op te lossen.
Mijn search.ts-bestand:
import { Data } from './../../services/data';
import { localData } from './../../services/local';
import { Component } from '@angular/core';
import { NavController } from 'ionic-angular';
import { Parse } from 'parse';
import 'rxjs/add/operator/map';
import {User} from '../../models/User';
import 'rxjs/add/operator/debounceTime';
import {FormControl} from '@angular/forms';
@Component({
selector: 'page-search',
templateUrl: 'search.html',
})
export class SearchPage {
currentUser = Parse.User.current();
query1 = new Parse.Query('Friends');
friendQuery = new Parse.Query('Friends');
query = new Parse.Query(Parse.User);
tmp: any =[];
users: any= [];
user: any =[];
initializeItems() {
this.users = this.dataService.tmpusers;
}
retrieveUsers(){
if (this.currentUser= Parse.User.current()) {
Parse.Cloud.run('UserQuery').then(
res => {
console.log('user query')
this.tmp = res;
console.log(this.tmp);
this.dataService.setUsers2(this.tmp);
this.users = this.dataService.tmpusers;
console.log(this.users);
}
)
}
}
retrieveFriends(){
if (this.currentUser= Parse.User.current()) {
Parse.Cloud.run('FriendsQuery', {currentuser: 'fEjQgAPvDO'}).then(
res => {
console.log(res)
}
)
}
}
constructor(public navCtrl: NavController, private localdata: localData,
private dataService: Data) {
this.searchControl = new FormControl;
}
showUsers: any = false;
searchControl: FormControl;
searchTerm: string = '';
searching: any = false;
filterusers(searchTerm){
return this.users.filter((user) => {
return user.username.toLowerCase().indexOf(searchTerm.toLowerCase())
> -1;
});
}
ionViewDidLoad() {
this.retrieveFriends();
this.retrieveUsers();
this.setFilteredItems();
this.searchControl.valueChanges.debounceTime(700).subscribe(search => {
this.searching = false;
this.setFilteredItems();
});
}
onSearchInput(){
this.searching = true;
}
setFilteredItems() {
this.initializeItems();
this.users = this.filterusers(this.searchTerm);
}
onCancel(ev: any) {
this.initializeItems();
}
}
en mijn Data.ts-bestand:
import { Storage } from '@ionic/storage';
import { Injectable, Component } from '@angular/core';
@Injectable()
export class Data {
tmpusers = this.getUsers2();
constructor(public storage: Storage){
}
getUsers2() {
this.storage.get('users');
}
setUsers2(users){
this.storage.set('users', users);
}
}
Wanneer ik probeer dit uit te voeren, geeft de eerste consolelog me de array van de gebruikers, maar de tweede, die ik nodig heb, is undefined.
Wat kan ik doen?
Het spijt me voor het grote gedeelte van de code
Hartelijk dank
laatste code
import { Data } from './../../services/data';
import { localData } from './../../services/local';
import { Component } from '@angular/core';
import { NavController } from 'ionic-angular';
import { Parse } from 'parse';
import 'rxjs/add/operator/map';
import {User} from '../../models/User';
import 'rxjs/add/operator/debounceTime';
import {FormControl} from '@angular/forms';
@Component({
selector: 'page-search',
templateUrl: 'search.html',
})
export class SearchPage {
currentUser = Parse.User.current();
query1 = new Parse.Query('Friends');
friendQuery = new Parse.Query('Friends');
query = new Parse.Query(Parse.User);
tmp: any =[];
users: any= [];
user: any =[];
initializeItems() {
this.users = this.dataService.newusers;
}
retrieveUsers(){
if (this.currentUser= Parse.User.current()) {
Parse.Cloud.run('UserQuery').then(
res => {
console.log('user query')
this.tmp = res;
console.log(this.tmp);
this.dataService.setUsers2(this.tmp).then(()=>{
this.dataService.getUsers2().then((val)=>{
this.users = val;
console.log(this.users);
});
});
});
}
}
retrieveFriends(){
if (this.currentUser= Parse.User.current()) {
Parse.Cloud.run('FriendsQuery', {currentuser: 'fEjQgAPvDO'}).then(
res => {
console.log(res)
}
)
}
}
constructor(public navCtrl: NavController, private localdata: localData, private dataService: Data) {
this.searchControl = new FormControl;
}
showUsers: any = false;
searchControl: FormControl;
searchTerm: string = '';
searching: any = false;
filterusers(searchTerm){
return this.users.filter((user) => {
return user.username.toLowerCase().indexOf(searchTerm.toLowerCase()) > -1;
});
}
ionViewDidLoad() {
this.retrieveFriends();
this.retrieveUsers();
this.setFilteredItems();
this.searchControl.valueChanges.debounceTime(700).subscribe(search => {
this.searching = false;
this.setFilteredItems();
});
}
onSearchInput(){
this.searching = true;
//this code is to hide users until input is triggered
//if (this.searchTerm.length >=1)
// return this.showUsers= true;
// else {
// return this.showUsers = false;
// }
//end of code
}
setFilteredItems() {
this.initializeItems();
this.users = this.filterusers(this.searchTerm);
}
onCancel(ev: any) {
this.initializeItems();
}
//searchfriends() {
// this.friendQuery = new Parse.Query.or(this.query1.equalTo('fromUser',Parse.User.current()),this.query1.equalTo('toUser',Parse.User.current()));
//let users = this.query.find();
//return this.users;
//}
}
en de data.ts
import { Storage } from '@ionic/storage';
import { Injectable, Component } from '@angular/core';
@Injectable()
export class Data {
newusers = [];
tmpusers = this.getUsers2();
constructor(public storage: Storage){
}
getUsers2(): Promise<any> {
return this.storage.get('users');
}
setUsers2(users): Promise<any> {
return this.storage.set('users', users);
}
}
oude code werkt
import { Data } from './../../services/data';
import { localData } from './../../services/local';
import { Component } from '@angular/core';
import { NavController } from 'ionic-angular';
import { Parse } from 'parse';
import 'rxjs/add/operator/map';
import {User} from '../../models/User';
import 'rxjs/add/operator/debounceTime';
import {FormControl} from '@angular/forms';
@Component({
selector: 'page-search',
templateUrl: 'search.html',
})
export class SearchPage {
currentUser = Parse.User.current();
query1 = new Parse.Query('Friends');
friendQuery = new Parse.Query('Friends');
query = new Parse.Query(Parse.User);
tmp: any =[];
users: any= [];
user: any =[];
initializeItems() {
this.users = this.localdata.tmpusers;
}
retrieveUsers(){
if (this.currentUser= Parse.User.current()) {
Parse.Cloud.run('UserQuery').then(
res => {
console.log('user query')
this.tmp = res;
console.log(this.tmp);
this.localdata.setUsers(this.tmp);
this.users = this.localdata.tmpusers;
console.log(this.users);
});
}
}
retrieveFriends(){
if (this.currentUser= Parse.User.current()) {
Parse.Cloud.run('FriendsQuery', {currentuser: 'fEjQgAPvDO'}).then(
res => {
console.log(res)
}
)
}
}
constructor(public navCtrl: NavController, private localdata: localData, private dataService: Data) {
this.searchControl = new FormControl;
}
showUsers: any = false;
searchControl: FormControl;
searchTerm: string = '';
searching: any = false;
filterusers(searchTerm){
return this.users.filter((user) => {
return user.username.toLowerCase().indexOf(searchTerm.toLowerCase()) > -1;
});
}
ionViewDidLoad() {
this.retrieveFriends();
this.retrieveUsers();
this.setFilteredItems();
this.searchControl.valueChanges.debounceTime(700).subscribe(search => {
this.searching = false;
this.setFilteredItems();
});
}
onSearchInput(){
this.searching = true;
//this code is to hide users until input is triggered
//if (this.searchTerm.length >=1)
// return this.showUsers= true;
// else {
// return this.showUsers = false;
// }
//end of code
}
setFilteredItems() {
this.initializeItems();
this.users = this.filterusers(this.searchTerm);
}
onCancel(ev: any) {
this.initializeItems();
}
//searchfriends() {
// this.friendQuery = new Parse.Query.or(this.query1.equalTo('fromUser',Parse.User.current()),this.query1.equalTo('toUser',Parse.User.current()));
//let users = this.query.find();
//return this.users;
//}
}
en de local.ts
import { Component } from '@angular/core';
export class localData {
setUsers (users){
window.localStorage.users_data = JSON.stringify(users);
}
getUsers(){
return JSON.parse(window.localStorage.users_data || '[]');
}
tmpusers = this.getUsers();
constructor(){
this.tmpusers.sort(function(a, b) {
var nameA = a.username.toUpperCase(); // ignore upper and lowercase
var nameB = b.username.toUpperCase(); // ignore upper and lowercase
if (nameA < nameB) {
return -1;
}
if (nameA > nameB) {
return 1;
}
return 0;
});
}
}
Antwoord #1
Je kunt niet op die manier toegang krijgen tot die waarde aangezien het Async-operaties zijn. Je kunt het proberen zoals hieronder wordt weergegeven.
data.ts
getUsers2(): Promise<any> {
retrun this.storage.get('users');
}
setUsers2(users): Promise<any> {
return this.storage.set('users', users);
}
search.ts
retrieveUsers(){
if (this.currentUser= Parse.User.current()) {
Parse.Cloud.run('UserQuery').then(
res => {
console.log('user query')
this.tmp = res;
console.log(this.tmp);
this.dataService.setUsers2(this.tmp).then(()=>{
this.dataService.getUsers2().then((val)=>{
this.users = val;
console.log(this.users);
});
});
});
}
}
