AngularJS，工厂、供应商或服务

Question

我正在尝试在我的应用程序中保存一个包含用户名的变量，我有一个登录页面（指令），我可以在其中获取用户名。我试过了：

Provider：它保存了我的变量，但我只能在应用程序加载之前更改，我需要在控制器内部之后更改变量。

.provider('username',function(){

    var username = 'Default';

    return {
        setName: function(value) { 
            username = value; 
        },
        $get: function() { 
            return { 
                 name: username 
            } 
        }
    }

服务：它工作正常，但如果我刷新页面我会丢失变量。

.service('username', function () {

    var username;
    this.setName = function (value) {
        username = value;
    }
    this.name = function () {
        return username;
    }
})

有人能告诉我最好的方法是什么吗？我苦苦思索了几个小时想出点什么..

Answer 1

您应该创建一个使用浏览器本地 storage/session 存储来存储会话数据的工厂服务

尝试复习这些问题

Maintaining Session through Angular.js

AngularJS: Service vs provider vs factory

Answer 2

我通常使用工厂，看起来很完美，但就像你说的那样，刷新页面时会丢失所有数据。

此行为与 Factory 对象的 Angular 无关，但与 Javascript 和您的浏览器有关。您需要将此值保存在存储对象中（cookies、sessionStorage、localStorage，如果您从未使用过它们，这里是 link：Difference between Session Storage, Local Storage and Cookies in AngularJS）。

在你的例子中，在 this.setName 中，你将它存储在比方说 sessionStorage 中，当初始化你的工厂时，你只需检查这个值是否存在。

.service('username', function ($window) {
    var username = $window.sessionStorage.getItem('user');
    this.setName = function (value) {
        username = value;
        $window.sessionStorage.setItem('user', value);
    }
    this.name = function () {
        return username;
    }
})

（这段代码可能并不完美，比如如果值不存在，最好有一个专门的场景，但可以让您了解如何在您的情况下使用它）

AngularJS，工厂、供应商或服务

AngularJS, Factory, Provider or Services

provider

variables

service

angularjs