Question

我正在玩离子和本地存储。我正在搞乱离子示例应用程序来定制它，我遇到了麻烦。基本上主页列出了项目。一旦用户进入该项目，他们就可以添加到任务列表中。

要在主页上创建项目，用户打开模态并输入信息（标题，日期等...），然后将项目存储在本地存储中。 item数组有一个用于任务列表的嵌套数组。

一旦用户进入某个项目，他们就可以打开一个添加任务的模态。提交后，任务被推送到嵌套数组，该数组运行良好并输出：

但是，当用户返回列出所有项目的主页时，只会重复一些空对象（在本地存储中查找对象是完美的）。

我的列表控制器和内部列表控制器：

.controller('ProfileCtrl', function ($filter, $scope, $stateParams, $timeout, $ionicModal, Eventers) {


    var createEventer = function(eventerId, eventerTitle, eventerVenue, eventerDay, eventerMonth, eventerYear, eventerDate) {
        var newEventer = Eventers.newEventer(eventerId,eventerTitle, eventerVenue, eventerDay, eventerMonth, eventerYear, eventerDate);
        $scope.eventers.push(newEventer);
        Eventers.save($scope.eventers);
        }
        $scope.eventers = Eventers.all();

    $ionicModal.fromTemplateUrl('new-event.html', function(modal) {
        $scope.eventerModal = modal;
    }, 
    {
        focusFirstInput: false,
        scope: $scope
    });

    ////////////////////////////////

    $scope.date = new Date();
    console.log($scope.date);

    ////////////////////////////////

    $scope.createEventer = function(eventer, index) {
        var eventerId = localStorage.clickcount;
        var eventerTitle = eventer.title;
        var eventerVenue = eventer.venue;
        var eventerDay = eventer.day;
        var eventerMonth = eventer.month;
        var eventerYear = eventer.year;
        var eventerDate =  $scope.date;
       if (eventerId,eventerTitle, eventerVenue, eventerDay, eventerMonth, eventerYear, eventerDate) {
            createEventer(eventerId,eventerTitle, eventerVenue, eventerDay, eventerMonth, eventerYear, eventerDate);
            $scope.eventerModal.hide();
            eventer.title = "";
            eventer.venue = "";
            eventer.day = "";
            eventer.month = "";
            eventer.year = "";

        }


        console.log(eventer);
    };


})

和我的内心控制者：

.controller('ProfileInnerCtrl', function ($scope, $stateParams,$ionicModal, $timeout, Eventers) {
 $scope.eventer = Eventers.get($stateParams.eventerId);

    $ionicModal.fromTemplateUrl('new-task.html', function(modal) {
        $scope.eventerModal = modal;
    }, 
    {
        focusFirstInput: false,
        scope: $scope
    });

 $scope.createTask = function(task) {

        $scope.eventer.tasks.push({
            title: task.title
        });

        console.log(task.title);
        Eventers.save($scope.eventer);
        task.title = "";
        $scope.eventerModal.hide();

    };

    $scope.newTask = function() {
        $scope.eventerModal.show();
    };

    $scope.closeNewTask = function() {
        $scope.eventerModal.hide();
    }
     $scope.completionChanged = function() {
        Eventers.save($scope.eventers);
    };
})

--------编辑：添加工厂-------

.factory('Eventers', function() {

            /**/


    return {
        all: function() {
          var eventerString = window.localStorage['eventers'];
          if (eventerString) {
            return angular.fromJson(eventerString);
          }
          return [];
        },
        save: function(eventers) {
          window.localStorage['eventers'] = angular.toJson(eventers);
        },
        newEventer: function(eventerId, eventerTitle,eventerVenue , eventerDay, eventerMonth, eventerYear, eventerDate) {
            return {
                id: eventerId,
                title: eventerTitle,
                venue: eventerVenue,
                day: eventerDay,
                month: eventerMonth,
                year: eventerYear,
                date: eventerDate,
                tasks: []
            };
        },
        get: function(eventerId){
          var hell = window.localStorage['eventers'];
          var eventers = JSON.parse(hell);

            for (var i = 0; i < eventers.length; i++) {


              if (parseInt(eventers[i].id) === parseInt(eventerId)){
                    console.log(eventerId);
                    return eventers[i];
                }
            }

            return null;
        }


    }

});

添加图片：前2个显示主页和本地存储，然后添加任务。添加任务和主页后，最后2个显示本地存储

Answer 1

好吧，当你创建一个新任务时，你会在localStorage中保存$ scope.eventer，它只包含标题。

为什么不在$ scope.eventer中推送整个任务对象？

$scope.createTask = function(task) {

    $scope.eventer.tasks.push(task);
...

编辑：

添加任务后，localStorage中的求偶器不是数组，因此ng-repeat接受对象中的每个键。

尝试Eventers.save（[$ scope.eventer]）;对于测试，但是你必须重新考虑整个过程，当你在阵列中有多个对象时会怎样？你会以这种方式失去旧的

使用本地存储进行奇怪的重复行为

1 个答案: