未定义不是一个功能&依赖注入

时间:2014-12-14 16:09:04

标签: javascript angularjs undefined-function

AngularJs的新手我试图通过构建单页Todo应用程序进行训练。问题是,我在加载一个我试图用它的localStorage工厂时遇到了麻烦。目前我仍然坚持以下错误:

Undefined is not a function at routeconfig.resolve.store on app.js line 11.

以下是代码:

app.js

angular.module('TodoAngular', ['ngRoute'])
    .config(function($routeProvider) {
    'use strict';

    var routeConfig = {
        controller: 'TodoController' ,
        templareUrl: 'app/partials/TodoList.html',
        resolve: {
          store: function (todoAngularStorage) {
              // Récupère le module qui gère le localStorage
              return todoAngularStorage.then(function (module) {
                  module.get(); // Récupère les données
                  return module;
              });
          }
        }
    };

    $routeProvider
        .when('/todos', routeConfig)
        .otherwise({ 
            redirectTo: '/todos' 
        });
    }     
);

todoAngularStorage.js

angular.module('TodoAngular')
    .factory('todoAngularStorage', function ($http,$injector) {
        'use strict';

       return $injector.get('localStorage');
    })

    .factory('localStorage', function($q) {
        'use strict';

        var STORAGE_ID = 'todoAngularLocalStorage';

        var store = {
            todos: [],

            //récupérer depuis le local storage
            _getFromLocalStorage: function(){
                return JSON.parse(localStorage.getItem(STORAGE_ID) || '[]');
            },

            //enregistrer dans le local storage
            _saveToLocalStorage: function (todos) {
                localstorage.setItem(STORAGE_ID, JSON.stringify(todos));
            },

            //supprimer un Todo
            delete: function (todo) {
                //instanciation de l'API Deferred
                var deferred = $q.defer();

                store.todos.splice(store.todos.indexOf(todo), 1);

                store._saveToLocalStorage(store.todos);
                deferred.resolve(store.todos);

                return deferred.promise;
            },

            //récupérer les todos
            get: function () {

                //instanciation de l'API Deferred
                var deferred = $q.defer();

                angular.copy(store._getFromLocalStorage(), store.todos);
                deferred.resolve(store.todos);

                return deferred.promise;

            },

            //ajouter un todo à la fin de la todo list  
            insert: function (todo) {

                //instanciation de l'API Deferred
                var deferred = $q.defer();

                store.todos.push(todo);

                store._saveToLocalStorage(store.todos);
                deferred.resolve(store.todos);

                return deferred.promise;

            }
      };

      return store;
});

我一直在尝试调试它,看来问题来自我app.js文件的以下行中函数中传递的'module'

return todoAngularStorage.then(function (module) {

在构建我的应用程序时,我一直在关注此示例(https://github.com/tastejs/todomvc/tree/master/examples/angularjs),而且我现在真的看不出我的错误。

1 个答案:

答案 0 :(得分:0)

您的localStorage服务工厂正在返回一个没有任何名为then的属性的对象。然后,您从todoAngularStorage工厂返回相同的对象,并尝试将返回值的then属性用作函数,从而导致错误。看起来你只想这样做:

return todoAngularStorage.get().then(function () {
    return todoAngularStorage;
});

作为旁注,您应该能够通过调试(在问题所在的位置设置断点并查看变量值)并查看代码(该值来自何处)来找到它。 )。