在AngularJS中使用vm存储数据到数组中

我正在将数据存储到数组中，但是当我刷新页面时，数据在我的页面上消失。在AngularJS中使用vm存储数据到数组中

这是我的JS代码：

function VideoController() { 
    var vm = this; 

    vm.videos = []; 

    vm.addVideoUrl = function(text) { 
    vm.videos.push(angular.copy(text)); //HOW I AM TRYING TO SAVE DATA INTO MY ARRAY, VIDEOS 
} 

}

来源

2016-03-23 jaahvicky

我们需要更多信息。但是看起来控制器已经连接到你的视图 - >每当你刷新页面并将vm.videos设置为[] – niklas

每次刷新控制器的新实例时创建。为此阵列被重新初始化为空。

您可以使用浏览器的本地存储来存储和获取您的数据。

来源

2016-03-23 11:10:00

您可以使用$cookies（https://docs.angularjs.org/api/ngCookies/service/$cookies）暂时保存数据。这比本地存储更可取，因为它默认有一个到期时间。

来源

2016-03-23 11:14:12 cani

时，它会加载。记住cookie的大小是有限的，尽量不要在那里存储太多的数据。用户也可以在他的浏览器上禁用Cookie - 只需记住一件事。 –

您可以使用localstorage或sessionstorage，请参阅here的差异。

下面的例子演示了如何使用它为你的情况

angular.module('myApp', []) 
    .controller('myCtrl', ['$scope', function($scope) { 
    var saveVideosToStorage = function(){ 
     localStorage.setItem('videos', angular.toJson($scope.videos)); 
    } 

    var init = function() { 
     //load video array from localstorage/sessionStorage 
     var videos = angular.fromJson(localStorage.getItem('videos')); 
     if (!(videos instanceof Array)) { 
      //videos has been corrupted 
      $scope.videos = []; 
      saveVideosToStorage(); 
     } 

     $scope.videos = videos; 
    } 

    var addVideoUrl = function(text) { 
     $scope.videos.push(angular.copy(text)); //HOW I AM TRYING TO SAVE DATA INTO MY ARRAY, VIDEOS 
     saveVideosToStorage(); 
    } 

    $scope.addVideoUrl = addVideoUrl; 
    init(); 
    }]);

和标记

<div ng-repeat="video in videos track by $index">{{video}}</div> 
    <input ng-model="videoUrl" type="text"/> 
    <input type="button" ng-click="addVideoUrl(videoUrl);">

这里是plunker

注：

我使用%scope而不是var vm = this

我找到了关于localStorage，sessionStorage和易于理解的cookie的解释，请参阅here。

来源

2016-03-23 11:32:30

在AngularJS中使用vm存储数据到数组中

回答

相关问题