I am new to Angular and need to download data into a service. It works fine with local json file; however, obviously you want to get the data from another URL which then gives the issue of cross domain download. Is there a way to go around this? I need to download the data from here http://files.parsetfss.com/c2e487f5-5d96-43ce-a423-3cf3f63d9c5e/tfss-31564b7d-6386-4e86-97c5-cca3ffe988f3-phones.json rather than 'phones/phones.json' below.
'use strict';
/* Services */
function makeArray(Type) {
return function(response) {
var list = [];
angular.forEach(response.data, function(data) {
list.push(new Type(data));
});
return list;
}
}
function instantiate(Type) {
return function(response) {
return new Type(response.data);
}
}
angular.module('phonecatServices', []).
factory('Phone', function($http){
var Phone = function(data){
angular.copy(data, this);
};
Phone.query = function() {
return $http.get('phones/phones.json').then(makeArray(Phone));
}
Phone.get = function(id) {
return $http.get('phones/' + id + '.json').then(instantiate(Phone));
}
// Put other business logic on Phone here
return Phone;
});
Can this be put in the following query from parse.com (how can I write the http request bit to fit into Angular.
var query = new Parse.Query("coursesParse");
query.find({
success: function(results) {
},
error: function(error) {
}
});
You can do it this way.
Phone.query = function() {
var query = new Parse.Query("test");
query.find({
success: function(results) {
//makeArray(Phone(results));
for (var i = 0; i < results.length; i++) {
var object = {
"age": results[i].get('age'),
"carrier": results[i].get('carrier'),
"id": results[i].get('id1'),
"imageUrl": results[i].get('imageUrl'),
"name": results[i].get('name'),
"snippet": results[i].get('snippet')
};
makeArray(Phone(object));
}
},
error: function(error) {
}
});
}
Related
In DRF I have added pagination limit to 100 'PAGINATE_BY': 100,
since Restangular expects results in array form, I had to use the below meta extractor function in my angular app module
var app = angular.module("myapp", ["restangular"].config(function(
RestangularProvider){
RestangularProvider.setResponseExtractor(function(response, operation, what, url) {
if (operation === "getList") {
var newResponse = response.results;
newResponse._resultmeta = {
"count": response.count,
"next": response.next,
"previous": response.previous
};
return newResponse;
}
return response;
});
});
and my controller looks like
app.controller('DataCtrl',function($scope, Restangular){
var resource = Restangular.all('myapp/api/dataendpoint/');
resource.getList().then(function(data){
$scope.records = data;
});
}
Meta info is not available in controller, how do I paginate if there are more than 100 records available?
I suppose you could simply call:
RestangularProvider.addResponseExtractor(function(data, operation, what, url, response) {
if (operation === "getList") {
data._resultmeta = {
"count": response.count,
"next": response.next,
"previous": response.previous
};
return data;
}
return response;
});
and
var page = 2;
var resource = Restangular.all('myapp/api/dataendpoint/');
resource.getList({page: page}).then(function(data){
console.log(data._resultmeta.next ? 'there is more pages' : 'You reach the end');
});
I'm not usual with Rectangular but Django Rest Framework support pagination from query parameter
i have a problem with AngularJS I receive from api json that json contains a prod url and url prerpod I would make calls to these APIs to retrieve a new one json then compare the results to validate which are the same as the problem is that I have a 200 aPI test how can I do. Thank you in advance
ps I think the test objects with the method equals.
i have 100 object like this:
{
"ID": "1",
"URL_preprod": "url1",
"Preprod_bis": "url2",
"prod": "url3",
}
i need to check if the result of call is equals for each object.
function callAtTimeout() {
if ($scope.preprod && $scope.preprodBis) {
angular.equals($scope.preprod,$scope.preprodBis);
$scope.msg = "equals";
}}
$scope.test = function() {
if (tnrArray) {
for (var i = 0; i < tnrArray.length; i++) {
var urlPreprod = tnrArray[i].URL_preprod;
console.log(urlPreprod);
$http.get(urlPreprod).success( function(response) {
$scope.preprod = response;
console.log(response);
});
var urlPreprodBis = tnrArray[i].Preprod_bis;
console.log(urlPreprodBis);
$http.get(urlPreprodBis).success( function(response) {
$scope.preprodBis = response;
console.log(response);
});
$timeout(callAtTimeout, 3000);
}
var response1;
$http.get("/your/url").then(function(response) {
response1 = response;
return $http.get(response.prodUrl);
}).then(function(prodResponse) {
console.log(prodResponse);
console.log(_.isEqual(response1 , prodResponse)); // uses lodash
}).catch(function(badResponse) {
console.log("oops something went wrong", badResponse);
})
this should work - lodash is used to check for equality
TO DO THIS FOR 200 URLs ASYNCHRONOUSLY ...
var urlList = ['/path/url1','/path/url2','/path/url3'];
angular.forEach(urlList, function(url) {
var response1;
$http.get(url).then(function(response) {
response1 = response;
return $http.get(response.prodUrl);
}).then(function(prodResponse) {
console.log(prodResponse);
console.log(angular.equals(response1 , prodResponse));
}).catch(function(badResponse) {
console.log("oops something went wrong", badResponse);
})
});
I'm trying to get all the contacts in the phone using ng-cordova, I success to do that like the following, I create a service in AngularJS:
.factory("ContactManager", function($cordovaContacts) {
return {
getContacts: function() {
var options = {};
options.filter = "";
options.multiple = true;
//get the phone contacts
return $cordovaContacts.find(options);
}
}
})
Also the method find in the ng-cordova is't like the following:
find: function (options) {
var q = $q.defer();
var fields = options.fields || ['id', 'displayName'];
delete options.fields;
navigator.contacts.find(fields, function (results) {
q.resolve(results);
},
function (err) {
q.reject(err);
},
options);
return q.promise;
}
And did the following inside the controller:
ContactManager.getContacts().then(function(result){
$scope.users= result;
}, function(error){
console.log(error);
});
I noticed that in the $scope.users I find the formatted, middleName ..., but I can't find the phoneNumber, how can I get also the phoneNumbers?
If you log the contacts you should see an object with a phoneNumbers array in it.
ContactManager.getContacts().then(function(result){
$scope.users= result;
console.log(result);
...
If you don't it's something else.
I also made a somewhat close mock json of what the return looks like.
I need to save data and then I need to dispaly the changes immediately afterwards.
That's why I Have a
updateSaisine which allows me to update data
getOneSaisine which allows me get the data and display them:
Which is the more correct way and for which reasons ?
Should I write:
$scope.saveSaisine = function() {
saisineSrv.updateSaisine($scope.currentSaisine.idSaisine, $scope.currentSaisine).
then(
function() {
$scope.errorMessages = [];
if ($scope.currentSaisine.idMotif) {
toaster.pop('success', 'Réponse', 'Success');
angular.element('#modalSaisine').modal('hide');
saisineSrv.getOneSaisine($scope.currentSaisine.idSaisine, $scope.currentSaisine).then(function(response) {
$scope.currentSaisine.dateModif = response.dateModif;
});
},
function error(response) {
$scope.errorMessages = response.data;
toaster.pop('error', 'Réponse', 'We have a problem');
}
);
};
OR
$scope.saveSaisine = function() {
saisineSrv.updateSaisine($scope.currentSaisine.idSaisine, $scope.currentSaisine).
then(
function() {
$scope.errorMessages = [];
if ($scope.currentSaisine.idMotif) {
toaster.pop('success', 'Réponse', 'Success');
angular.element('#modalSaisine').modal('hide');
},
function error(response) {
$scope.errorMessages = response.data;
toaster.pop('error', 'Réponse', 'We have a problem');
}
);
saisineSrv.getOneSaisine($scope.currentSaisine.idSaisine, $scope.currentSaisine).then(function(response) {
$scope.currentSaisine.dateModif = response.dateModif;
});
};
the first option is a correct way how you should refresh your data because these services are asynchronous thus in the second example you may don't get fresh data (the getOneSaisine can finish before updateSaisine).
I have a service that handles "episodes": creating, deleting and updating them. It looks like this:
app.service('Episode', ['$firebase', 'FIREBASE_URL', function($firebase, FIREBASE_URL) {
var ref = new Firebase(FIREBASE_URL);
var episodes = $firebase(ref);
return {
all: episodes,
create: function(episode) {
location.reload();
//Add to firebase db
return episodes.$add(episode);
},
delete: function(episodeId) {
location.reload();
return episodes.$remove(episodeId);
},
update: function(episode) {
location.reload();
return episodes.$save(episode);
}
};
}]);
Inside my controller:
app.controller('AdminCtrl', ['$scope', 'Episode', function ($scope, Episode) {
$scope.episodes = Episode.all;
$scope.createEpisode = function(){
Episode.create($scope.episode).then(function(data){
$scope.episode.name = '';
$scope.episode.title = '';
$scope.episode.description = '';
$scope.episode.time = '';
$scope.episode.img = '';
});
};
$scope.deleteEpisode = function(episodeId){
if(confirm('Are you sure you want to delete this episode?') === true) {
Episode.delete(episodeId).then(function(data){
console.log('Episode successfully deleted!');
});
}
};
$scope.updateEpisode = function(episode) {
Episode.update($scope.episode).then(function(data) {
console.log('Episode successfully updated.');
});
};
The only example of uploading images to Firebase from AngularJS I've seen online is this: https://github.com/firebase/firepano
How am I able to incorporate this into an object based addition/update instead of finding it's index/link?