Develop Reference

How to resolve a promise within another promise and get the resolution within a controller?

I have a function in a service returns a promise. I call this function from a different service where I want to alter the result of the promise and make this new altered value available to my controllers.
angular.module('test').service("service1", function($q) {
function doSomething(something) {
//parses some data
return deferred.promise;
}
return {
doSomething: doSomething
}
});
angular.module('test').service("service2", ['service1', $q, function(service1, $q) {
var deferred = $q.defer();
var myResult = deferred.promise;
service1.doSomething("test").then(function (result) {
var alteredResult = result + "Altered"; //result I want to be accessible by my controllers
deferred.resolve(alteredResult)
});
return {
myResult: myResult
}
}]);
angular.module('test').controller('testController', ['$scope', 'service2', function ($scope, service2) {
$scope.test = service2.myResult;
}]);
It obviously didn’t work when I was initializing myResult outside of the .then() and updating it inside because myResult was passed to the controller before it was altered. This lead me to try creating another promise inside of service2.
After all of this, I get a promise in $scope.test but it ends up being a blank {} javascript object.
How can I properly store the altered result of service2 so that I can access it from my controllers?
Thanks you very much for your time. Let me know if you need additional information or if I am being unclear.

You are assigning promise to the scope variable. You should resolve the promise (promise chain) and assign the resolved value instead.
service2.myResult.then(function(result) {
$scope.test = result;
});

Calling additional service functions after a resolved promise in Angular

In Angular I have a service to access the google contacts api, then store all my contacts into variable (StorageVar) to be analyzed by other functions in the service.
Should I call one of the analysis functions before getting the data from the API, I want to call the getAPI function then (as in .then()) run the analysis function. The issue is that I can't figure out how to access any of the functions from the .then() scope.
angular.module('API',[])
.factory('API', ['$rootScope', '$http','$q', function ($rootScope, $http, $q) {
var StorageVar = [];
return{
getAPI: function(){
//does async call, returns promise, stores data into StorageVar
}
Analyze: function(){
if(StorageVar.length==0){
//need to get the data first
this.getAPI().then(function(){
//Analyze()
debugger;
}
}
}
In my controller I would want to use my service like this:
angular.module('views.local', ['API'])
.controller('localctrl',['API',function(API){
API.Analze()
//Callable even if the getAPI function hasn't run, so the Analyze function will take care of that.
}])
Any assistance is appreciated.

Is this what you mean?
angular.module('API',[])
.factory('API', ['$rootScope', '$http','$q', function ($rootScope, $http, $q) {
var StorageVar = [];
return{
getAPI: function(){
//does async call, returns promise, stores data into StorageVar
}
Analyze: function(){
if(StorageVar.length==0){
//need to get the data first
var _this = this;
this.getAPI().then(function(){
//Analyze()
_this.Analyze();
debugger;
}
}
}

When calling a function that returns a function that returns a function, how do you get data at the bottom?

How can I access the data from the function inside the function inside the function I'm returning?
projectsRsrc.factory('projectsSrvc', ['$resource', function($resource){
return function(name){
var url = "http://localhost/proj/v3/apiSimulations/projects.json";
var resource = $resource(url);
return resource.get(function(data){
return data;
});
}
}]);
I want to get this data in my controller.
projectsApp.controller('projectsCtrl', ['$scope', 'projectsSrvc', function($scope, projectsSrvc){
$scope.projects = projectsSrvc(name);
}
But projectsSrvc returns a function, and I'm not really sure how to access the function it is returning. Ultimately I want the data to be assigned in my controller

Your factory returns a function and that function returns a promise so in your controller your code should be like this:
projectsSrvc(name).then(function(data) {
$scope.projects = data;
});
Edit: I mixed up $resource with $http so things seem a little different, however everything is explained here: https://docs.angularjs.org/api/ngResource/service/$resource
I got it to work by changing the code to this:
projectsSrvc(name).$promise.then(function(data) {
$scope.projects = data;
});
Tested here: http://jsbin.com/vepivacosa/1/edit?html,js,console

You just need another set of parantheses
$scope.projects = projectsSrvc(name)(argumentmustbepassedhereforthefunction);
But note that you'll need some callback kind of thing(or promises may be?) as you're returning from the ajax call which is asynchronous.
BTW the above code is just a one-liner for
var func = projectsSrvc(name); // store the function reference
$.scope.projects = func(argumentmustbepassedhereforthefunction);

Angular + requirejs - the controller cannot pick up ajax return data from the factory?

My controller cannot pick up the data that processed from $http.get() in requirejs environment. Any idea how can I fix it?
UserFactory.js
define(['app'], function (app) {
app.module1.factory('UserFactory', ['$http', function($http) {
//your minsafe controller
var factory = {};
factory.getUsers = function(){
$http.get('api.php').success(function(data) {
// here the data from the api is assigned to a variable named users
return data; // [{"id":"1","name":"Big Kev","email":"bigkev#example.com"},{"id":"2","name":"Judy","email":"punk#example.net"},{"id":"3","name":"Suzy","email":"suzy#example.com"},{"id":"4","name":"Joey","email":"sheena#example.org"},{"id":"5","name":"DeeD","email":"deedee#example.net"}]
});
};
return factory;
}]);
});
view.js,
define(['app'], function (app) {
app.module1.controller('View1Ctrl', ['$scope','UserFactory', function($scope,userFactory) {
//your minsafe controller
$scope.message = "Message from View1Ctrl";
$scope.users = userFactory.getUsers();
console.log($scope.users); // undefined
}]);
});
as you can see, I get undefined for $scope.users. It seems that console.log($scope.users); is executed before $http.get('api.php') in the factory. How can I fix this then?

This has nothing to do with Require; it is a very common misconception about how asynchronous code runs (especially promises).
You see factory.getUsers() makes an asynchronous call. The response will be available at a later time and success will be called with the response data at that later time. On the other hand, $scope.users = userFactory.getUsers() is synchronous. It is almost guaranteed that the async call wll NOT have returned by the time the next statement runs. And even if it has returned, the callback will NOT have run because Javascript is single threaded in the browser.
Moreover you have another serious fault: the success callback is "procedural" in the sense that it receives the response and has to do something with it. Its return value is disregarded!
To use promises (or at least $http) correctly in this case, change factory.getUsers to return the $http promise:
factory.getUsers = function(){
return $http.get('api.php');
};
And change the controller to use the promise or the success/error callbacks:
// option (1) with promise
userFactory.getUsers().then(function(response) {
$scope.users = response.data;
});
// option (2) callback
userFactory.getUsers().success(function(data) {
$scope.users = data;
});

Angularjs error when calling factory method

I am new to angularjs. I am trying to call a function in a factory but I am getting the below error,
Error: [$injector:undef] Provider 'todoStorage' must return a value from $get factory method.
This is my factory,
todomvc.factory('todoStorage', function ($q,$http) {
var STORAGE_ID = 'todos-angularjs-perf';
function get(){
var promise = $q.defer();
$http.get('http://localhost/test.php').success(function(data){
promise.resolve(data);
});
return promise.promise;
}
});
And this is how I call the function,
var todos = $scope.todos = todoStorage.get();
What exactly is happening and why this error coming up?

todomvc.factory('todoStorage', function ($q,$http) {
var STORAGE_ID = 'todos-angularjs-perf';
function get(){
return $http.get('http://localhost/test.php');
}
return{get:get};
});
//call the service like this
todoStorage.get().then(function(res){
$scope.todos = res.data;
});
Your code is not returning the actual service factory. Since you are using factory you have return some JavaScript object pointing to your internal function. Otherwise it's not a valid factory, and your external code will have no way of getting to the internal get function.