AngularJS ui-router resolve is undefined

Question

I have moved from using ngRoute to ui-router. I am trying to resolve a Factory call in the route for use in the controller but it is undefined when output to the console. Here is the Factory:

'use strict';

angular.module('angular10App')

.factory('AirportService', function ($http) {

return {

    getAirports: function () {

        var airports = $http.get('../json/airports.json')
            .then(function (response) {

                console.log(response.data); //Outputs an array of objects

                return response.data;
            });
    }
});

Here is the Route:

'use strict';

angular.module('angular10App')
    .config(function ($stateProvider) {
    $stateProvider
        .state('selectFlights', {
            url: '/select_flights',
            templateUrl: 'app/selectFlights/selectFlights.html',
            controller: 'SelectFlightsCtrl',
            resolve: {

                AirportService: 'AirportService',

                airports: function (AirportService) {
                    return AirportService.getAirports();
                }
            },
        });
    });

and here is the controller:

'use strict';
angular.module('angular10App')
.controller('SelectFlightsCtrl', function ($scope, airports) {

$scope.selectedAirport = null;

    $scope.airports = airports;
    console.log($scope.airports); //undefined
});

score 3 · Accepted Answer · 2015-07-11 13:57:20Z

3

Try changing your resolve block to this:

resolve: {
    airports: function (AirportService) {
        return AirportService.getAirports();
    }
}

And modify the getAirPorts function into:

function getAirports () {
  // You need to return the $http promise (or in your case, 'var airports');
  return $http.get('../json/airports.json')
    .then(function (response) {
      console.log(response.data); //Outputs an array of objects
      return response.data;
    });        
}

edited Jul 11, 2015 at 13:57

answered Jul 11, 2015 at 13:45

user1364910

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

2 Comments

user1364910 Over a year ago

Sorry, I didn't pay much attention to the getAirports function as the Resolve block looked quite odd. Looks to me like you are returning a function that is creating a variable, but not actually returning the $http promise. Though I could be wrong.

SquarePeg Over a year ago

That was it. It was the return $http.get that was wrong. Thanks.

Collectives™ on Stack Overflow

AngularJS ui-router resolve is undefined

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