0

I'm new to angular and I am trying implementing a local storage for my angular application. I have the basic CRUD operations. When I call the insert() function from my controller I get the error in the title, 'myStorage is undefined'

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);
    };
}]);

In the addData() function the line console.log($scope.store.dataStore); will print out the empty array to console. But when I try to call $scope.store.insert(o) an error is thrown out to the console.

4

1 に答える 1

0

再び確かめる。エラーはありません。エラーは次の行にあるはずです。

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

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

それらを次のように変更する必要があります。

(そのコンテキストで使用できる名前の変数がなく、 /が の関数であるため、参照myStorageを に変更します)localStoragemyStoragegetItemsetItemlocalStorage

    _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 に答える