angularjs $resource non-callback pattern not working

Question

I found that the document from angularjs website says I could do something in my factory like this:

 var speicialProducts = [];

 factory.getFeatureProducts = function () {
    if ($.isEmptyObject(specialProducts)) {
        specialProducts = $resource('index.php/products/featureProducts').query().$promise.then(function(data){
            return data;
            // return data.content;
        });
    }
    return specialProducts;
}

and then in my controller I do:

$scope.specialProducts = specialProductFactory.getFeatureProducts();

But somehow the angularjs doesn't fill up the scope model when the data is been correctly returned.

I did try to do:

var speicialProducts = [];

 factory.getFeatureProducts = function () {
    if ($.isEmptyObject(specialProducts)) {
        specialProducts = $resource('index.php/products/featureProducts').query();
    }
    return specialProducts;
}

This is working, but I want to do something to assign part of the returned data to specialProducts but not the entire returned data (like what I did in the comment part in the first code example return data.content). So any ideas I could make this works?

if there are some jsfiddle examples that will be great. Thanks

The last thing I want to change is the $scope.specialProducts = specialProductFactory.getFeatureProducts();, because I might want this pattern for the rest of possible datasource need — Tim Raynor
– Tim Raynor, Commented Jan 17, 2014 at 11:15

Chandermani · Accepted Answer · 2014-01-17 11:22:43Z

1

Try this

 if ($.isEmptyObject(specialProducts)) {
        $resource('index.php/products/featureProducts').query().$promise.then(function(data){
            angular.foreach(data,function(item) {
                 specialProducts.push(item);
            });
        });
    }

But in your controller you need to know when the data was returned from remote call for which you can watch over the specialProducts array.

Update: Better would be to use promises, but in this case

$scope.specialProducts = specialProductFactory.getFeatureProducts();

would fill the array in future. To know when you need to watch

$scope.$watchCollection("specialProducts",function(data) { //Called when data updated});

I strongly suggest you work with promise based API and use the then methods to get handle async responses.

edited Jan 17, 2014 at 11:22

answered Jan 17, 2014 at 7:14

Chandermani

42.7k12 gold badges88 silver badges89 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Tim Raynor Over a year ago

how should I use it in controller? also $scope.specialProducts = specialProductFactory.getFeatureProducts(); ?

Tim Raynor Over a year ago

Thank you, the $promise way is working, I just want to confirm if I can do it in a assignment way so that the code will look more simple and angular should fill up the $promise when the data return for me. But After I search a lot in the web, seems the promise and then are more common way of doing, so thank you

Collectives™ on Stack Overflow

angularjs $resource non-callback pattern not working

1 Answer 1

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related