Angular JS, how to pass URL parameters to $resouce in angularJS?

Question

Hi I have a simple controller where it passes unique integers into my url, but Im running to many issues. I need to change this "4401" dynamically from my controller.

the url Im trying to reach: https://itunes.apple.com/us/rss/topmovies/limit=50/genre=4401/json

app.factory('classic',function ($resource) {

    return $resource('https://itunes.apple.com/us/rss/topmovies/limit=50/genre=:id/json', {
        get: {
            method: 'JSONP',
            id: '@id'
        }
    });

});

and here is my controller

app.controller('TestCrtl', function ($scope, classic) {
    init();
    function init(id) {
        $scope.movies = classic.get(id);
    }
    $scope.classicMovies = function(){
        var id = "4403";
        init(id);
    }


    $scope.anctionMovies = function(){
        var id = "4404";
        init(id);
    }
});

The error Im getting Uncaught SyntaxError: Unexpected token :

any help would be highly appreciated.

 <div class="col-sm-4">
            <button type="button" data-ng-click="actionMovies()" class="btn btn-default">Action</button>
        </div>
        <div class="col-sm-4">
            <button type="button" class="btn btn-default">Scary</button>
        </div>

Adam_O · Accepted Answer · 2015-04-18 05:45:49Z

1

I believe this is the correct way to implement parameters when using a resource factory:

app.factory('movieService',function ($resource) {
    return $resource('https://itunes.apple.com/us/rss/topmovies/limit=50/genre=:id/json', {id: '@id'}, {
        query: { method: 'GET', isArray:true, params: {id: '@id'} }
    });
});

This can be simplified to:

app.factory('movieService',function ($resource) {
    return $resource('https://itunes.apple.com/us/rss/topmovies/limit=50/genre=:id/json', {id: '@id'});
});

To call this get method you would need to do the following. Note the parameters that are used in the get method.

app.controller('TestCrtl', function ($scope, movieService) {

    $scope.classicMovies = function(){
        movieService.query({id: 4403}, function(result){
            $scope.movies = result;
        });
    }
    $scope.anctionMovies = function(){
        movieService.query({id: 4404}, function(result){
            $scope.movies = result;
        });
    }
});

Additionally, it should be noted that the resource method call is going to return a promise. You can either set it from the return value of the get method, like you did above (The status of the promise isn't guaranteed), or you can set it in the callback, which guarantees that the promise is resolved.

edited Apr 18, 2015 at 5:45

answered Apr 18, 2015 at 4:55

Adam_O

3413 silver badges11 bronze badges

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

8 Comments

user1429595 Over a year ago

well it doesnt seems like it, when I call both classic and action movies I get the same thing

Adam_O Over a year ago

What URL is generated for both classic and action movies?

user1429595 Over a year ago

the id doesnt get passes properly :(

Adam_O Over a year ago

Sorry! Wasn't thinking about both sides of the problem. Take a look at my edit. That should resolve it for you.

user1429595 Over a year ago

do I have to do anything to update the view/scope, it is always returning the same thing, I really appreciate your help though

|

Reena · Accepted Answer · 2015-04-18 04:46:07Z

1

Try this:

app.factory('classic',function ($resource) {

    return $resource('https://itunes.apple.com/us/rss/topmovies/limit=50/genre=:id/json', {
        get: {
            method: 'JSONP',
            id: '@id'
        }
    });

});

And in controller change to :

$scope.movies = classic.get(id);

answered Apr 18, 2015 at 4:46

Reena

1,1199 silver badges17 bronze badges

1 Comment

user1429595 Over a year ago

it didnt do it, it calls itunes.apple.com/us/rss/topmovies/limit=50/genre=/json

Collectives™ on Stack Overflow

Angular JS, how to pass URL parameters to $resouce in angularJS?

2 Answers 2

8 Comments

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

8 Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related