0

我是 Angular 新手，我正在尝试为我的 Angular 应用程序实现本地存储。我有基本的 CRUD 操作。当我insert()从控制器调用函数时，标题中出现错误，“myStorage 未定义”

MyApp.js

var MyApp = angular.module('MyApp', ['ngMaterial', 'ngMessages', 'material.svgAssetsCache', 'ngRoute'])
    .config(function ($routeProvider) {
        'use strict';

        var routeConfig = {
            controller: 'ButtonCtrl',
            templateUrl: 'index.html',
            resolve: {
                store: function (myStorage) {
                    // Get the correct module (API or localStorage).
                    return myStorage.then(function (module) {
                        module.get(); // Fetch the todo records in the background.
                        return module;
                    });
                }
            }
        };

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

myStorage.js

var MyApp = angular.module('MyApp');

MyApp.factory('myStorage', ['$q', function($q) {
    console.log('store init');

    var STORAGE_ID = 'my_app';

    var store = {
        dataStore: [], 

        _getFromDataStore: function() {
            return JSON.parse(myStorage.getItem(STORAGE_ID) || '[]');
        }, 

        _saveToDataStore: function() {
            return myStorage.setItem(STORAGE_ID, JSON.stringify(dataStore));
        }, 

        delete: function(data) {
            var deferred = $q.defer();

            store.dataStore.splice(store.dataStore.indexOf(data), 1);

            store._saveToDataStore(store.dataStore);
            deferred.resolve(store.dataStore);

            return deferred.promise;
        }, 

        get: function() {
            var deferred = $q.defer();

            angular.copy(store._getFromDataStore(), store.dataStore);
            deferred.resolve(store.dataStore);

            return deferred.promise;
        }, 

        insert: function(data) {
            var deferred = $q.defer();

            store.dataStore.push(data);

            store._saveToDataStore(store.dataStore);
            deferred.resolve(store.dataStore);

            return deferred.promise;
        }, 

        put: function(data, index) {
            var deferred = $q.defer();

            store.dataStore[index] = data;

            store._saveToDataStore(store.dataStore);
            deferred.resolve(store.dataStore);

            return deferred.promise;
        }
    };


    return store;
}]);

ButtonCtrl.js

var MyApp = angular.module('MyApp');

MyApp.controller('ButtonCtrl', ['$scope', 'myStorage', function($scope, myStorage) {

    $scope.store = myStorage;

    $scope.addData = function() {
        var o = new Object()
        o.key = 'someKey';
        o.value = 'Hello, world';
        console.log($scope.store.dataStore);
        $scope.store.insert(o); // Throws error myStorage is not defined.
        console.log($scope.store.dataStore);
    };
}]);

在addData()函数中，该行将console.log($scope.store.dataStore);打印出空数组到控制台。但是当我尝试调用$scope.store.insert(o)时，控制台会抛出一个错误。

4

1 回答 1

0

再检查一遍。错误不存在，错误必须在这些行中：

    _getFromDataStore: function() {
        return JSON.parse(myStorage.getItem(STORAGE_ID) || '[]');
    }, 

    _saveToDataStore: function() {
        return myStorage.setItem(STORAGE_ID, JSON.stringify(dataStore));
    },

您需要将它们更改为：

（将引用更改为myStorage，因为在该上下文中localStorage没有可用的变量命名，并且/是 的函数）myStoragegetItemsetItemlocalStorage

    _getFromDataStore: function() {
        return JSON.parse(localStorage.getItem(STORAGE_ID) || '[]');
    }, 

    _saveToDataStore: function() {
        return localStorage.setItem(STORAGE_ID, JSON.stringify(dataStore));
    },
于 2016-09-11T04:09:30.533 回答