1
    function storyData($http, $q) {
        var URL = 'stories.json';

        var storyCache = [];

        this.getStories = function() {
            var deferred = $q.defer();

            alert(URL);

            $http({method: 'GET', url: URL})
                .success(function (data, status, headers, config) {
                    storyCache = data;
                    alert(storyCache); //correct data appears in the alert window, but this doesn't set the instance storyCache variable for some reason

                    deferred.resolve(data);
                })
                .error(function (data, status, headers, config) {
                    deferred.reject(status);
                });

            return deferred.promise;
        };

        this.stories = function() {
            return storyCache;
        }
    }

My app -

'use strict';

var angularApp = angular.module('ccsApp', ['ngRoute', 'ngAnimate', 'ui.bootstrap']);

angularApp.config(['$routeProvider',
    function($routeProvider) {
        $routeProvider.
            when('/', {
                templateUrl: 'stories.html',
                controller: 'StoryController as StoryCtrl',
                resolve: {
                    stories: function(storyData) {
                        return storyData.getStories();
                    }
                }

            })
            .otherwise({
                redirectTo: '/'
            });
    }
]);

Within my controller, I'm not injecting the "stories" value from the routeProvider so that I can use my service.

Why am I unable to change storyCache from within my $http method? I'm confident this is something terribly simple, but my research hasn't led me to an answer. Thank you in advance for your help.

The async. aspect of this works fine and is not the problem. I'm ensuring that I have the data by using the resolve object on my routeProvider. Also, I'm ensuring that I have the data before the deferred.resolve(data) method executes by issuing an alert on it. I don't have the solution, but an error in my use of async. is not the solution either.

Flexo
  • 87,323
  • 22
  • 191
  • 272
Charles Sounder
  • 591
  • 2
  • 5
  • 16
  • Are you sure you're accessing `storyCache` after the success method has been executed ? – LJᛃ Jan 08 '15 at 02:26
  • 2
    asynchronous call. Are you trying to eat the pizza before the delivery man brought it to your house? – epascarello Jan 08 '15 at 02:31
  • If I issue an alert(storyCache) after the "storyCache = data;" line, the alert is correct data. – Charles Sounder Jan 08 '15 at 02:41
  • What makes you think you can't change it? You even display the value after the assignment and it shows the correct value. – Brandon Jan 08 '15 at 02:46
  • @CharlesSounder as mentioned by epascarello you have to wait for your request to finish before you can access the data. – LJᛃ Jan 08 '15 at 02:49
  • Not sure if its related but feels close to a question i asked http://stackoverflow.com/questions/25419058/scope-inaccessible-in-nested-function – onaclov2000 Jan 08 '15 at 03:55
  • So rather you need to use $apply, otherwise the var might not get updated, i only suggest, since this is angular related – onaclov2000 Jan 08 '15 at 03:56
  • How did you access the stories object in your controller? Can you post your StoryController's code? – Mr. Duc Nguyen Jan 08 '15 at 04:24
  • Okay Duc, I posted both the controller and the service in full. Perhaps I should get some sleep as this wasn't that difficult of a problem after all. Thanks to everyone who helped. – Charles Sounder Jan 08 '15 at 04:35
  • Ops, you deleted your RouteProvider codes... I was trying to make sure if you map the inject to the right object name ;P – Mr. Duc Nguyen Jan 08 '15 at 04:37
  • I guess I know what is the problem here: In your controller, you are asking for storyData service, which will be injected immediately. In your routeProvider, you did have a resolve option, but your controller doesn't ask for it... You can try to change your controller's injection list to this: StoryController.$inject = ['$scope', '$log', 'storyData', 'stories']; // 'stories' is the key you use for the promise object then try to access your stories again :) – Mr. Duc Nguyen Jan 08 '15 at 04:41
  • Duc, it works fine; I posted my solution at the top. My resolve option also worked fine. It was only the var self = this declaration that needed adjustment. Thanks. – Charles Sounder Jan 08 '15 at 05:02
  • You should post your solution as a full answer, not by editing the question. – Flexo Jan 08 '15 at 10:47
  • Where did the solution go? You've removed it? – Charles Sounder Jan 08 '15 at 14:25

0 Answers0