javascript - Angularjs 数据存储最佳实践

Question

我的 Angular 应用程序有 2 个 Controller 。我的问题是，当用户离开页面时， Controller 不会保留数据。

如何将 Controller 上选定的数据存储到数据存储中，以便可以在其他 Controller 之间使用？

Answer 1

选项 1 - 自定义服务

您可以利用专用的 Angular 服务在 Controller 之间存储和共享数据( services 是单实例对象)

服务定义

 app.service('commonService', function ($http) {

        var info;

        return {
            getInfo: getInfo,
            setInfo: setInfo
        };

        // .................

        function getInfo() {
            return info;
        }

        function setInfo(value) {
            info = value;
        }
});

在多个 Controller 中使用

app.controller("HomeController", function ($scope, commonService) {

    $scope.setInfo = function(value){
        commonService.setInfo(value);
    };

});


app.controller("MyController", function ($scope, commonService) {

    $scope.info = commonService.getInfo();

});

<小时/>

选项 2 - html5 localStorage

您可以使用内置的浏览器本地存储并从任何地方存储您的数据

写作

$window.localStorage['my-data'] = 'hello world';

阅读

var data = $window.localStorage['my-data']
// ...

• 看看这个很棒的项目: https://github.com/grevory/angular-local-storage

<小时/>

选项 3 - 通过网络服务器 API

如果需要在不同用户之间保存数据，则应该将其保存在服务器端的某个位置(db/cache)

function getProfile() {
    return $http.get(commonService.baseApi + '/api/profile/');
}

function updateProfile(data) {
    var json = angular.toJson(data);
    return $http.post(commonService.baseApi + '/api/profile/', json);
}