Can't get data from request - angularjs

Question

I'm new to json and can't get data from request correct.
I haven't got any problems with getDrivers(), but when I try to get data from getDriverRaces($scope.id) I get nothing.
I've tried to do it manualy: http://ergast.com/api/f1/2015/drivers/hamilton/results.json?callback=JSON_CALLBACK
and result was -
angular.module('F1FeederApp.controllers', []).
controller('driversController', function ($scope, ergastAPIservice) {
$scope.nameFilter = null;
$scope.driversList = [];
$scope.searchFilter = function (driver) {
var re = new RegExp($scope.nameFilter, 'i');
return !$scope.nameFilter || re.test(driver.Driver.givenName) || re.test(driver.Driver.familyName);
};
ergastAPIservice.getDrivers().success(function (response) {
$scope.driversList = response.MRData.StandingsTable.StandingsLists[0].DriverStandings;
});
}).
controller('driverController', function ($scope, $routeParams, ergastAPIservice) {
$scope.id = $routeParams.id;
$scope.races = [];
$scope.driver = null;
ergastAPIservice.getDriverRaces($scope.id).success(function (response) {
$scope.races = response.MRData.RaceTable.Races;
});
});
<div class="main-content">
<table class="result-table">
<thead>
<tr><th colspan="5">Formula 1 2015 Results</th></tr>
</thead>
<tbody>
<tr>
<td>Round</td>
<td>Grand Prix</td>
<td>Team</td>
<td>Grid</td>
<td>Race</td>
</tr>
<tr ng-repeat="race in races">
<td>{{race.round}}</td>
<td>{{race.raceName}}</td>
<td>{{race.Results[0].Constructor.name}}</td>
<td>{{race.Results[0].grid}}</td>
<td>{{race.Results[0].position}}</td>
</tr>
</tbody>
</table>
</div>
angular.module('F1FeederApp.services', [])
.factory('ergastAPIservice', function ($http) {
var ergastAPI = {};
ergastAPI.getDrivers = function () {
return $http({
method: 'JSONP',
url: 'http://ergast.com/api/f1/2015/driverStandings.json?callback=JSON_CALLBACK'
});
}
ergastAPI.getDriverRaces = function (id) {
return $http({
method: 'JSONP',
url: 'http://ergast.com/api/f1/2015/drivers/' + id + '/results.json?callback=JSON_CALLBACK'
});
}
return ergastAPI;
});
Any help would appreciate.

Answer 1

The problem is that because of carelessness I entered same controller twice, because of common name.
.
config(['$routeProvider', function ($routeProvider) {
$routeProvider.
when("/drivers", { templateUrl: "partials/drivers.cshtml", controller: "driversController" }).
when("/drivers/:id", { templateUrl: "partials/driver.cshtml", controller: "driverController" }).
otherwise({ redirectTo: "/drivers" });
}]);

Answer 2

I think your problem is how you are trying to get at the data in the success functions.
This
ergastAPIservice.getDriverRaces($scope.id).success(function (response) {
$scope.races = response.MRData.RaceTable.Races;
});
should be this (data returned from a $http call is in response.data)
ergastAPIservice.getDriverRaces($scope.id).success(function (response) {
$scope.races = response.data.MRData.RaceTable.Races;
});
The response object has the following properties (see documentation here near top)
data - your response should be in here
status
headers
config
statusText
You are trying to access property response.MRData which will never exist but response.data.MRData should