$localStorage 数组选择与 ng-options 无法正常工作？答案

【问题标题】：$localStorage array select with ng-options not working properly?$localStorage 数组选择与 ng-options 无法正常工作？
【发布时间】：2016-05-03 20:24:31
【问题描述】：

这是我的代码。我正在使用 $localStorage 将对象推送到数组中。当我单击按钮时，对象被正确推送并再次拼接同一个对象时单击同一个按钮。 $localStorage.tableArray 分配给 $scope.Storage 用于下拉列表。按钮操作完成后，下拉列表就很好了。

我的问题是 $scope.$storage 有两个项目。如果我刷新页面下拉列表没有来。如果我在按钮下拉列表上执行的推送或拼接操作会很好。

请帮助在刷新页面时如何将 $scope.$storage 项添加到下拉列表中。我为此创建了一个plunker。检查一次

HTML：

<body ng-controller="MainCtrl">
<a class="btn {{table.btnClass}} btn-success" ng-repeat="table in tablelist" ng-click="getTable(table)" style="padding-left:1px">{{table.tablename}}</a>
<select ng-options="table.tablename as table.tablename for table in $storage" ng-model="table.tablename"><option value="">---select table---</option></select>

JS：

var app = angular.module('plunker', ["ngStorage"]);
        app.controller('MainCtrl', function ($scope,$localStorage,$filter) {
            $scope.tablelist = [{ "tablename": "t1" }, { "tablename": "t2" },{ "tablename": "t3" },{ "tablename": "t4" }]
        if ($localStorage.tableArray === undefined) {
            $localStorage.tableArray = []
        }
        if ($localStorage.tableslist === undefined) {
            $localStorage.tableslist = []
        }

        angular.forEach($scope.tablelist, function (list, $index) {
            var found = $filter('filter')($localStorage.tableArray, { tablename: list.tablename }, true);
            if (found.length) {
                $scope.tablelist[$index].btnClass = found[0].btnClass;
            }
        });


        $scope.getTable = function (table) {

            table.btnClass = table.btnClass == "btn-danger" ? "btn-success" : "btn-danger"
            var exists = false;
            angular.forEach($localStorage.tableArray, function (list, $index) {
                if ((list.tablename == table.tablename)) {
                    console.log(list.tablename)
                    console.log(table.tablename)
                    exists = true;
                    $localStorage.tableArray.splice($index, 1)
                    $localStorage.tableslist.splice($index, 1)
                    $scope.$storage= $localStorage.tableArray;
                    console.log( $scope.$storage)

                    return false
                }
            });
            if (!exists) {
                $localStorage.tableslist.push(table)
                $localStorage.tableArray = $localStorage.tableslist;
                $scope.$storage = $localStorage.tableArray
                console.log($localStorage.tableArray)
                table.color = "red"
            }
        }
    });

https://plnkr.co/edit/0RpAGVR5ZpVFMvmmxipu?p=preview

【问题讨论】：

非常感谢@Fidel90。为我工作

标签： javascript angularjs local-storage

【解决方案1】：

据我了解，您希望下拉列表在刷新时使用本地存储中的存储值进行初始化。

在控制器中添加以下行对我有用：

$scope.$storage = $localStorage.tableArray

查看plnkr

【讨论】：