AngularJS - $http service list objects by parameter

Question

I'm sending this parameter (year) from a select element and I'm using the $http service in order to list an array of objects based on the parameter but for some reason it does not work.

I have the 404 (Not Found) error because the parameter does not appear in the url in order to make the request.

Select element:

<select data-ng-model="year" data-ng-change="listByYear(year)">
    <option value="">Select year</option>
    <option value="2014">2014</option>
    <option value="2015">2015</option>
</select>

Controller appController and fuction listByYear():

moduleApp.controller("appController", function($scope, $http){
    $scope.listByYear = function(year){
        console.info("Parameter received: "+year)
        var parameter = {
            year: $scope.year
        };
        var config = {
            param: parameter
        };
        $http.get("/pro/users/listByYear", config)
        .success(function (data, status, headers, config) {
            $scope.users = data;
            console.info("Ok")
        }).error(function (data, status, header, config) {
            console.error("Error")  
        });
    } 
});

Simply "pro/users/listByYear/2015" and the server will send all objects based in this parameter but when I see the console log in the browser I have an error with the following format "pro/users/listByYear/?year=2015" 404 (Not Found) — wilson
– wilson, Commented Oct 29, 2015 at 21:44

Deblaton Jean-Philippe · Accepted Answer · 2015-10-29 21:46:34Z

1

Based on your comments, this will do it (a simple string concatenation) :

$http.get('/pro/users/listbyyear/' + year);

will produce :

'/pro/users/listbyyear/2014'

edited Oct 29, 2015 at 21:46

answered Oct 29, 2015 at 21:30

Deblaton Jean-Philippe

11.4k4 gold badges53 silver badges68 bronze badges

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

Comments

Thibaud Sowa · Accepted Answer · 2015-10-29 23:03:26Z

0

From the doc I read params with an 's'.

So like this it should work better:

var config = {
    params: parameter
};

EDIT2:

You should use the standard 'then' method instead of 'success' and 'error' method because of the depreciation of these methods:

$http.get("/pro/users/listByYear", config)
    .then(function (response) {
        console.log('data:', response.data);
        console.log('status:', response.status);
        console.log('headers:', response.headers);
    }).catch(function (response) {
        console.log('data:', response.data);
        console.log('status:', response.status);
        console.log('headers:', response.headers);
    });

See https://docs.angularjs.org/api/ng/service/$http#deprecation-notice

edited Oct 29, 2015 at 23:03

answered Oct 29, 2015 at 21:28

Thibaud Sowa

4124 silver badges19 bronze badges

Collectives™ on Stack Overflow

AngularJS - $http service list objects by parameter

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related