jquery - 如何在 Angular 服务中使用 jQuery.cookie 插件

Question

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

所以我尝试使用这个 jQuery cookie plugin .

但是，我不知道如何在 angular.service 中提供它。思考如何使 jQuery 插件在 Controller 和服务中可用，答案一致指向 using 指令，但我认为在这种情况下这不是正确的方法，因为 cookie 是 Controller 和服务应该了解的东西。

那么，如何让 jQuery 插件可用于 Angular 服务呢？

Answer 1

您可以将 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 promise 进行回调怎么样？

所以我们的工厂变成:

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);
        }
    }
});

然后你可以在 Controller 中使用它，如下所示:

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

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

});

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