首页 > 解决方案 > 如何在angularjs中为现有cookie添加新值?

问题描述

我正在使用 angulajs,在按钮单击时我正在设置 cookie,它工作正常,但是一旦页面刷新然后在按钮单击新值存储在数组中,但旧 cookie 值将变为空,如何保留旧 cookie 值和加上必须增加新的价值。我怎么能这样做?

在控制器中——

 $scope.populateTimeZone = function (world_timezones) {
    var objTimeZoneDetails = new TimeZoneDetails(
       moment.tz(world_timezones.trim()).format('LTS'),
       moment.tz(world_timezones.trim()).format('LL'),
       moment.tz.zone(world_timezones.trim()).abbr(moment.utc().valueOf()),
       moment.tz.zone(world_timezones.trim()).name);

    //push values to array
    $scope.LstTimeZoneDetails.push(objTimeZoneDetails);

    $scope.selectedTimeZones = $scope.LstTimeZoneDetails;
    $cookies.putObject('selectedTimeZones', $scope.LstTimeZoneDetails);
};

if ($cookies.getObject('selectedTimeZones') === '' || $cookies.getObject('selectedTimeZones') === undefined)
    $cookies.putObject('selectedTimeZones', $scope.LstTimeZoneDetails);

$scope.selectedTimeZones = $cookies.getObject('selectedTimeZones') || {};

在 HTML 中——

<div class="form-inline">
                            <div class="form-group">
                                <select class="form-control" data-ng-model="selectedTimeZone">
                                    <option data-ng-repeat-start="(key, value) in timeZoneData.countries" data-ng-bind="value.name" data-ng-disabled="true" style="font-weight: bold;"></option>
                                    <option data-ng-repeat-end="" data-ng-repeat="tz in value.timezones" data-ng-bind="' - ' + tz" data-ng-value="tz"></option>
                                </select>
                            </div>
                            <div class="form-group">
                                <input id="btnAddTimeZone" type="button" value="Add Time Zone" class="btn btn-default" data-ng-click="populateTimeZone(selectedTimeZone)" />
                            </div>
                        </div>

标签: javascriptjqueryhtmlangularjs

解决方案


我需要查看更多您的代码才能确定,但​​是从您展示的少量代码来看,我看不到您将 cookie 数据加载到LstTimeZoneDetails. 据我所知,这就是正在发生的事情:

第一次加载: LstTimeZoneDetails可能是一个空数组(因为.push()不抱怨)检查cookie值是否存在,设置为空数组(LstTimeZoneDetailsselectedTimeZones成为那个空数组,或者一个空对象{})如果LstTimeZoneDetails 还不是一个数组......你可能希望这是一个数组,但我不知道您的其余代码是什么样的。

单击按钮:将某些内容附加到LstTimeZoneDetails数组中,设置selectedTimeZonesLstTimeZoneDetails(为什么您需要两个不同的东西指向范围内的同一个对象超出了我的范围,但是好的...)将 cookie 替换为selectedTimeZones

刷新页面:cookie不为空,设置selectedTimeZones为cookie值。此时,LstTimeZoneDetails与上面“第一次加载”中的“无论是什么”相同。假设它是一个空数组,所以它是一个空数组。

单击按钮:将某些内容附加到LstTimeZoneDetails数组中,设置selectedTimeZonesLstTimeZoneDetails(为什么您需要两个不同的东西指向范围内的同一个对象超出了我的范围,但是好的...)将 cookie 替换为selectedTimeZones

...........

你看到问题了吗?

你永远不会LstTimeZoneDetails用旧值填充,而是用新值替换你用旧值填充的变量

所以我再次问 - 为什么会有不同的变量,从我可以看出的只是相互镜像?

要修复,要么只使用一个,要么(据我所知)用这个替换$scope.selectedTimeZones = $cookies.getObject('selectedTimeZones') || {};问题$scope.LstTimeZoneDetails = $cookies.getObject('selectedTimeZones') || []; ,但是,现在LstTimeZoneDetails不会设置,所以无论哪种方式你都需要重新考虑你的方法。


推荐阅读