I'm working on getting a promise to resolve after a Firebase query. Essentially I want to get all of the specified keys from a table and then loop through another table in order to get the artwork I want.
artistFactory.js
'use strict';
angular.module('artvoicesApp')
.factory('Artist', function(localStorageService, FIREBASE_URL, $q) {
var artistData = {};
var userKey = localStorageService.get('userKey');
var accountKey = localStorageService.get('accountKey');
var artistRef = FIREBASE_URL.child('v2/artist');
var accountRef = FIREBASE_URL.child('v2/account/' + accountKey);
var userRef = FIREBASE_URL.child('v2/user/' + userKey);
artistData.addArtist = function(artistName) {
var artist = artistRef.push();
accountRef.child('artists/' + artist.key()).set(true);
userRef.child('artists/' + artist.key()).set(true);
artist.set({name: artistName});
artist.child('users/' + userKey).set(true);
artist.child('accounts/' + accountKey).set(true);
};
artistData.getArtistKeys = function() {
var artistKeys = [];
var defer = $q.defer();
accountRef.child('artists').once('value', function(snapshot) {
snapshot.forEach(function(childSnapShot) {
artistKeys.push(childSnapShot.key());
});
defer.resolve(artistKeys);
});
return defer.promise;
};
artistData.getArtists = function(artistKeys) {
var artistObj = {};
var artistRef = FIREBASE_URL.child('v2/artist');
var defer = $q.defer();
artistKeys.forEach(function(artist) {
artistRef.child(artist).once('value', function(snapshot) {
artistObj[artist] = snapshot.val();
});
defer.resolve(artistObj);
});
return defer.promise;
};
return artistData;
});
artwork.controller.js
Artist.getArtistKeys().then(function(artistKeys) {
Artist.getArtists(artistKeys).then(function(artists) {
vm.artists = artists;
console.log(vm.artists);
});
});
If I set vm.artwork to a timeout, it returns the appropriate data.
Here's your problem:
artistKeys.forEach(function(artist) {
artistRef.child(artist).once('value', function(snapshot) {
artistObj[artist] = snapshot.val(); // <<== This is called second, at an unspecified time in the future
});
defer.resolve(artistObj); // <<== This is called first
});
All of your assignments to artistObj will occur at some time after you called defer.resolve(artistObj). This is why it appeared to work once you added a timeout.
You will need to map your collection of artists to a collection of promises, then wait for all of these promises to resolve.
artistData.getArtistKeys = function(artistKeys) {
var artistObj = {};
var artistRef = FIREBASE_URL.child('v2/artist');
var allPromises = artistKeys.map(function(artist) {
var childDefer = $q.defer();
artistRef.child(artist).once('value', function(snapshot) {
artistObj[artist] = snapshot.val();
childDefer.resolve();
});
return childDefer.promise();
});
// allPromises is now an array of promises
var defer = $q.defer();
$q.all(allPromises).then(function() {
defer.resolve(artistObj);
});
return defer.promise();
}
Related
As the title states, I'm having trouble with Promises in Parse.
I'm struggling to firstly understand exactly how Promises themselves work, especially in Parse.
I have been stuck on this for about three weeks and the closest I've come to a solution is having an empty array returned.
What I'm trying to do is scrape a site and then create objects from the table (this is working)
Where there trouble comes in, is I am then running a for loop on the results and querying each Dam name to get the resulting objectid from the database.
Here is my code:
var c = new Crawler({
maxConnections: 10,
// This will be called for each crawled page
callback: function(err, res, done) {
if (err) {
console.log(err);
} else {
var $ = res.$;
// $ is Cheerio by default
//a lean implementation of core jQuery designed specifically for the server
console.log($("title").text());
}
done();
}
});
The Function which Creates objects from the Dom and adds them to an array:
function getDamObjects(Dom) {
var dom = Dom;
var LevelObjects = [];
for (i = 1; i < dom.length - 1; i++) {
var TableRow = dom.eq(i);
var NameString = TableRow.children().eq(0).text();
var RiverString = TableRow.children().eq(1).text();
var FSCString = TableRow.children().eq(4).text();
var ThisWeekString = TableRow.children().eq(5).text();
var LastWeekString = TableRow.children().eq(6).text();
var LastYearString = TableRow.children().eq(7).text();
NameString = NameString.replace('#', '');
NameString = NameString.replace('$', '');
NameString = NameString.replace('&', '');
NameString = NameString.replace('#', '');
ThisWeekString = ThisWeekString.replace('#', '');
ThisWeekString = ThisWeekString.replace('$', '');
ThisWeekString = ThisWeekString.replace('&', '');
ThisWeekString = ThisWeekString.replace('#', '');
LastWeekString = LastWeekString.replace('#', '');
LastWeekString = LastWeekString.replace('$', '');
LastWeekString = LastWeekString.replace('&', '');
LastWeekString = LastWeekString.replace('#', '');
LastYearString = LastYearString.replace('#', '');
LastYearString = LastYearString.replace('$', '');
LastYearString = LastYearString.replace('&', '');
LastYearString = LastYearString.replace('#', '');
var level = {};
/*
getDamObject(NameString).then(function(DamObject){
let DamID = DamObject.id;
*/
level['Dam'] = NameString; //DamID;
level['ThisWeek'] = ThisWeekString;
level['LastWeek'] = LastWeekString;
level['LastYear'] = LastYearString;
LevelObjects.push(level);
};
return LevelObjects;
};
The Get Dam Object Code:
function getDamObject(Dam) {
var promise = new Parse.Promise();
var query = new Parse.Query("DayZeroDams");
query.equalTo("Name", Dam);
query.first().then(function(DamObject) {
promise.resolve(DamObject);
}, function(error) {
promise.reject(error);
});
return promise;
}
The Cloud Code Called:
Parse.Cloud.define('jsdom', function(request, response) {
c.queue([{
uri: 'xxxxxx',
// The global callback won't be called
callback: function(err, res, done) {
if (err) {
response.error(err);
} else {
var $ = res.$;
var ResultsArray = [];
var dom = res.$('#mainContent_tw').children('tr');
return Parse.Promise.as().then(function() {
var promise = Parse.Promise.as();
var LevelObjects = getDamObjects(dom);
_.each(LevelObjects, function(DamLevel) {
promise = promise.then(function() {
var Name = DamLevel["Dam"];
var query = new Parse.Query("DayZeroDams");
query.equalTo("Name", Name);
return query.first().then(function(result) {
let damID = result.id;
ResultsArray.push(damID);
return Parse.Promise.as();
}, function(error) {
response.error(error);
});
});
});
return promise;
}).then(function() {
response.success(ResultsArray);
}, function(error) {
response.error(error);
});
//response.success(LevelObjects);
}
done();
}
}]);
});
Please take note that I am fairly novice when it comes to Javascript, I have only recently started learning it in order to work with my server code.
Convert getDamObjects into an async function and then await the result of each row, pushing it to the array:
function replaceSymbols(input) {
return input.replace(/[#\$&#]/g, '');
}
async function getDamObjects(Dom) {
const dom = Dom;
const levelObjects = [];
for (let i = 1; i < dom.length - 1; i++) {
const children = dom.eq(i).children();
const NameString = replaceSymbols(children.eq(0).text());
const RiverString = children.eq(1).text();
const FSCString = children.eq(4).text();
const ThisWeek = replaceSymbols(children.eq(5).text());
const LastWeek = replaceSymbols(children.eq(6).text());
const LastYear = replaceSymbols(children.eq(7).text());
const Dam = await getDamObject(NameString);
levelObjects.push({
Dam,
ThisWeek,
LastWeek,
LastYear,
});
}
return levelObjects;
}
Remember that now that getDamObjects is an async function, it will return a Promise that resolves to the array once iterations are complete. Consume it using await getDamObjects in another async function (or use .then)
I am using Parse data, but the deal is, i want to return the variable ParseUserArray, but just after it passing by the success promisse. I was wondering how can i do that.
var UserWs = angular.module('UserWs', []);
UserWs.service('UserWsService', ['parseInit', function(parseInit){
var service = this;
this.getUserAtParse = function(id){
var user = Parse.Object.extend("User");
var query = new Parse.Query(user);
var parseUserArray = [];
query.find({
success: function(anUser) {
for (var i = 0; i < anUser.length; i++) {
var newUser = new User(anUser[i]);
parseUserArray.push(newUser);
}
console.log(parseUserArray);
}
});
var User =function(anUser){
this.id = anUser.id;
this.name = anUser.get("name");
this.email = anUser.get("username");
this.company = anUser.get("company");
}
return parseUserArray;
};
thanks in advance :)
You can use promise for this - $q service
var UserWs = angular.module('UserWs', []);
UserWs.service('UserWsService', ['$q', 'parseInit', function($q, parseInit) {
var service = this;
this.getUserAtParse = function(id) {
var defer = $q.defer();
var user = Parse.Object.extend("User");
var query = new Parse.Query(user);
var parseUserArray = [];
query.find({
success: function(anUser) {
for (var i = 0; i < anUser.length; i++) {
var newUser = new User(anUser[i]);
parseUserArray.push(newUser);
}
console.log(parseUserArray);
defer.resolve(parseUserArray);
}
});
var User = function(anUser) {
this.id = anUser.id;
this.name = anUser.get("name");
this.email = anUser.get("username");
this.company = anUser.get("company");
}
return defer.promise;
}
}]);
UserWs.controller('sampleCtrl', ['$scope', 'UserWsService', function($scope, UserWsService) {
UserWsService.getUserAtParse(SOME_ID).then(function(resultArray) {
//logic here
});
}]);
I defined a JavaScript function using a custom service and I called this function using the service in my controller. This function uses two parameters: The first one is input which I am getting by hitting the below API and the second one is the value of the year which I'm getting using ng-model directive. When I am calling this function in my controller I am getting an error like type is not defined or id is not defined etc. Is it the right way to call a JavaScript function in the controller. Please suggest me.
$http.get("http://152.144.218.70:8080/USACrime/api/crimeMultiple?city=" +$scope.strCity + "&crime=" + $scope.type1 + "&model=" + model).success(function (result) {
$scope.prograssing = false;
console.log("manisha", $scope.strCity);
console.log("kanika", result);
$scope.output = result;
console.log("monga", $scope.output);
$scope.hex = hexafy.year_city($scope.output,$scope.type);
console.log("service", $scope.hex);
});
myapp.js
var app= angular.module("myApp",["ngRoute","leaflet-directive","pb.ds.components"]);
var geomarker = new L.FeatureGroup();
app.service('hexafy', function() {
this.year_city = function (input2,years) {
if(years.toLowerCase()=="all"){
years = "2012,2013,2014,2015,2016,2017,2018,2019";
}
var yrs = years.split(",");
output = {};
outerBoundary = {};
boundary = {};
boundary["boundaryId"] = input[0]["id"];
boundary["boundaryType"] = input[0]["type"];
boundary["boundaryRef"] = "C1";
outerBoundary["boundary"] = boundary;
output["boundaries"] =outerBoundary;
themes = [];
for(var i in input){
crimeTheme = {};
crimeThemeValue = {};
crimeThemeValue["boundaryRef"] = "C1";
result = [];
for(var j in input[i]["prediction"]){
dict = {};
if(yrs.indexOf(input[i]["prediction"][j]["year"])>-1){
dict["name"] = input[i]["prediction"][j]["year"]+" "+input[i]["crime"]+" Crime";
dict["description"] = input[i]["crime"]+" Crime for "+input[i]["prediction"][j]["year"];
dict["value"] = input[i]["prediction"][j]["count"];
dict["accuracy"] = input[i]["accuracy"];
result.push(dict);
}
}
crime = input[i]["crime"].toLowerCase()+"CrimeTheme";
crimeThemeValue["individualValueVariable"] = result;
console.log('crimeThemeValue["individualValueVariable"]',crimeThemeValue["individualValueVariable"]);
crimeTheme[crime] = crimeThemeValue;
themes.push(crimeTheme);
console.log("themes",JSON.stringify(themes));
}
output["themes"] = themes;
console.log(output);
return output;
};
});
});
1) .success and .error methods are deprecated and it is not good to go with it. Instead you'd better use .then(successCallback, errorCallback)
2) To use a service method the proper way is to it like this:
app.service('myService', function() {
var service = {
method:method
};
return service;
function method() {
//Logic
}
})
So in your case the way to go is:
app.service('hexafy', function () {
return {
years_city: function (input2, years) {
if (years.toLowerCase() == "all") {
years = "2012,2013,2014,2015,2016,2017,2018,2019";
}
var yrs = years.split(",");
output = {};
outerBoundary = {};
boundary = {};
boundary["boundaryId"] = input[0]["id"];
boundary["boundaryType"] = input[0]["type"];
boundary["boundaryRef"] = "C1";
outerBoundary["boundary"] = boundary;
output["boundaries"] = outerBoundary;
themes = [];
for (var i in input) {
crimeTheme = {};
crimeThemeValue = {};
crimeThemeValue["boundaryRef"] = "C1";
result = [];
for (var j in input[i]["prediction"]) {
dict = {};
if (yrs.indexOf(input[i]["prediction"][j]["year"]) > -1) {
dict["name"] = input[i]["prediction"][j]["year"] + " " + input[i]["crime"] +
" Crime";
dict["description"] = input[i]["crime"] + " Crime for " + input[i]["prediction"]
[j]["year"];
dict["value"] = input[i]["prediction"][j]["count"];
dict["accuracy"] = input[i]["accuracy"];
result.push(dict);
}
}
crime = input[i]["crime"].toLowerCase() + "CrimeTheme";
crimeThemeValue["individualValueVariable"] = result;
console.log('crimeThemeValue["individualValueVariable"]', crimeThemeValue[
"individualValueVariable"]);
crimeTheme[crime] = crimeThemeValue;
themes.push(crimeTheme);
console.log("themes", JSON.stringify(themes));
}
output["themes"] = themes;
console.log(output);
return output;
}
}
})
Below is my code. if we use set timeout function we got all data but we not use we are not getting inspection data which is coming from my local db. i want use deferred and promises in my code. Thanks in advance.
function onclickToCall() {
this.$('.check-list > .check-list-box').each(function (i) {
var j = i + 1;
var answer_req = $(this).attr("data-isReq");
var checklist_guid = $(this).attr("data-guid");
var question_type = $(this).attr("data-type");
var yes_no = $("input:radio[name='radio_" + j + "']:checked").val();
var notes = $(this).find('#txtAreaNotes_' + j).val();
var attachment_url = $(this).find(".txtCameraImage").attr("data-path");
var appConfig = DriverConnectApp.State.get('config_settings');
var item = {};
item.checklist_guid = checklist_guid;
item.yes_no = yes_no;
item.attachment_url = attachment_url;
item.notes = notes;
if (question_type == 2) { // For Vehical visual inspection
var dataPromise = that.getInspectionData(checklist_guid);
dataPromise.done(function (response, vh_image) {
var inspectionItem = {};
inspectionItem.vh_url = vh_image;
inspectionItem.details = response;
item.vh_inspection = inspectionItem;
that.detailsArr.push(item);
});
} else {
item.vh_inspection = {};
that.detailsArr.push(item);
}
});
// after finish and push all data we need to call function here
test();
}
getInspectionData: function (checklist_guid) {
var that = this;
var deferred = $.Deferred();
that.dbchecklist.getVehicleInspectionlist(checklist_guid, function (data, res) {
var details = [];
if (data.length) {
var img = data[0].vh_image;
var arr = JSON.parse(data[0].vh_details);
for (var k = 0; k < arr.length; k++) {
var items = {};
items.number = arr[k].number;
items.notes = arr[k].notes;
items.attachment_url = arr[k].attachment_url;
details.push(items);
}
deferred.resolve(details, img);
} else {
deferred.resolve(details, img);
}
});
return deferred.promise();
}
I am able to get data back but I seem to be failing at getting the result back up through some methods above this:
car.js
'use strict';
var Q = require('q');
var pg = require('co-pg')(require('pg'));
var config = require('../../models/database-config');
var car = module.exports = {};
car.find = Q.async(function *(id)
{
var query = 'SELECT id, title, description FROM cars WHERE id = ' + id;
var connectionResults = yield pg.connectPromise(config.connection);
var client = connectionResults[0];
var done = connectionResults[1];
var result = yield client.queryPromise(query);
done();
console.log("value: " + result.rows[0].id);
return result.rows;
});
this returns a valid value for my console.log so I know I'm getting data back.
But now when I try to pass that back up the stack, here I seem to be losing it after this method:
database.js
module.exports = {
models: {
car: _carModel
},
find: Q.async(_find)
};
function _find(carId)
{
_carModel.find(carId)
.then(function(result){
console.log('result[0].id: ' + result[0].id);
return result;
})
.catch(function(error){
console.log("promise error: " + error);
})
.done();
};
So this also works, I get a valid value for console.log('result[0].id: ' + result[0].id);
But now when try to call this function, I lose the result:
gateway.js
var car = database.find(carId);
console.log("car: " + car.id);
...
here I get a'Cannot read property 'id' of undefined]'
UPDATE #2
So I am trying to propagate now the promise up, but still get undefined for the line console.log("returned car data: " + data); 'data' is undefined.
gateway.js
module.exports = {
data: function(someData){
_data = someData;
},
find: function(text, result){
if(!text){
results(null);
};
var endpoint = _endpoint.replace(/_text/g, text);
_client.query(endpoint, function(results){
var cars = [];
var car;
for (var i = 0; i < results.docs.length; i++){
var carId = results.docs[i].id;
car = database.find(carId)
.then(function(data){
console.log("returned car data: " + data);
})
.done();
cars.push(car);
}
result(cars);
});
}
database.js
'use strict';
var Q = require('q');
var _obituaryModel = require('../../models/postgreSQL/obituary');
module.exports = {
models: {
obituary: _carModel
},
find: Q.async(_find)
};
function _find(carId)
{
_carModel.find(carId)
.then(function(result){
console.log('result[0].id: ' + result[0].id);
return result;
})
.catch(function(error){
console.log("promise error: " + error);
})
.done();
};
carModel.js
'use strict';
var Q = require('q');
var pg = require('co-pg')(require('pg'));
var config = require('../../models/database-config');
var car = module.exports = {};
car.find = Q.async(function *(id)
{
var query = 'SELECT id, title, description FROM cars WHERE id = ' + id;
var connectionResults = yield pg.connectPromise(config.connection);
var client = connectionResults[0];
var done = connectionResults[1];
var result = yield client.queryPromise(query);
done();
console.log("value: " + result.rows[0].id);
return result.rows;
});
You have a promise object at your disposal, use it.
In database.js:
return _obituaryModel.find(carId)
and gateway.js
var car = database.find(carId);
car.then(function (data) {
console.log(data);
});
You can't return data from an asynchronous function.
See here: How to return value from an asynchronous callback function?
You are printing result[0].id on the console but reading result.id on the actual call:
Try
var car = database.find(carId);
console.log("car: " + car[0].id);
...