3

我一直在尝试使用ngCookie在我的应用程序中存储和检索 cookie。由于我无法设置使用 创建的 cookie 的路径或过期时间,因此ngCookie我不得不寻找其他地方。

所以我正在尝试使用这个jQuery cookie 插件

但是,我不知道如何使其在 Angular 服务中可用。围绕如何使 jQuery 插件在控制器和服务中可用,答案一致指向使用指令,但我认为在这种情况下这不是正确的方法,因为 cookie 是控制器和服务应该知道的。

那么,如何让 jQuery 插件可用于 Angular 服务呢?

4

2 回答 2

5

您可以将 jquery cookie API 封装在工厂中,这样会暴露一些方法:

angular.module('MyApp', []);

angular.module('MyApp').factory('CookieFactory', function(){

    return {
        getCookie: function(name){
            return $.cookie(name);
        },

        getAllCookies: function(){
            return $.cookie();
        },

        setCookie: function(name, value){
            return $.cookie(name, value);
        },

        deleteCookie: function(name){
            return $.removeCookie(name);
        }
    }
});

但是我们可以很容易地想象,当你得到 cookie 值时,你想做一些事情。通过 AngularJS 的 API 承诺回调呢?

所以我们的工厂变成了:

angular.module('MyApp', []);

angular.module('MyApp').factory('CookieFactory', function($q, $timeout){

    return {
        getCookie: function(name){
           var deferred = $q.defer();

           $timeout(function() {
               deferred.resolve($.cookie(name));
           }, 0);

           return deferred.promise;
        },

        getAllCookies: function(){
            return $.cookie();
        },

        setCookie: function(name, value){
            return $.cookie(name, value);
        },

        deleteCookie: function(name){
            return $.removeCookie(name);
        }
    }
});

然后你可以像这样在你的控制器中使用它:

angular.module('MyApp').controller('CookieCtrl', function(CookieFactory) {

    CookieFactory.getCookie('mycookie').then(function(value){
      //do that you want
    });

});

在这里工作 plunkr:http://plnkr.co/edit/6KoUtp?p= preview

于 2013-09-23T19:14:54.030 回答
2

我认为这是您想要使用服务而不是指令的一个实例。通常,当您处理修改 DOM 元素的 jQuery 插件时,将使用指令。

它看起来像这样。

angular.module('app', []).service('myCookieService', function(){
    return {
        cookie: $.cookie,
        removeCookie: $.removeCookie
    }
});

当然,话虽如此,您可以从应用程序的任何位置调用 jQuery 插件。

于 2013-09-23T19:03:17.330 回答