Question

我只是玩角和它的DI。我也尝试使用promises范例，但是我遇到了一个相当奇怪的问题，在Chrome扩展程序中使用它。

以下代码非常有效。当调用“chromeStorageService”中的对象文字中的cb（）时，将解决promise。但是当我取消注释返回chrome.storage.local;时代码停止工作。我无法理解为什么，因为console.log('going to be resolved');仍然被解雇，但成功警报却没有。提前感谢任何提示：）

http://jsfiddle.net/Ku5dz/

https://developer.chrome.com/extensions/storage.html

'use strict';
var app = {};

app = angular.module('options', ['options.controllers']);

app.services = angular.module('options.services', []);


app.services.factory('chromeStorageService', function () {
    //return chrome.storage.local;


    return {
        get: function(id, cb) {
            cb();
        }
    }
});

app.services.factory('storageService', ['chromeStorageService', '$q', function (chromeStorage, $q) {
    return new function () {
        this.get = function (identifier) {
            var defered = $q.defer();

            chromeStorage.get(identifier, function (items) {
                var error = false//chrome.runtime.lastError;
                if (error) {
                    return defered.reject(error);
                }

                console.log('going to be resolved');
                console.log(defered);
                defered.resolve();
            });

            return defered.promise;
        }
    }
}]);

app.services.factory('fooService', ['storageService', function (testService) {
    return new function () {
        this.getAll = function () {
            var promise = testService.get('foo');
            console.log(promise);
            promise.then(
                function () {
                    alert('success');
                }, function () {
                    aler('err');
                }
            );
        }
    }
}]);


app.directive('foo', ['fooService', function (fooService) {
    return {
        restrict:'A',
        link:function (scope, elm, attrs, ctrl) {
            fooService.getAll();    
        }
    };
}]);


app.controllers = angular.module('options.controllers', ['options.services']);

Answer 1

Angular有自己的小事件循环事物。当你.resolve承诺时，会进入Angular的队列。仅当Angular清除其队列时才会发生填充。

通常做的事情是：

$scope.$apply(function() {
  promise.resolve(thing);
});

当控制从你传递给它的函数返回到$ apply时，它会清除队列，一切都很漂亮。在这种情况下，您可能需要将$ rootScope注入服务，以便根据The view is not updated in AngularJS提供一些内容。

你的存根工作是因为存根永远不会离开角度世界，所以你已经在一个将照顾队列的上下文中。当您使用chrome.storage.local时，不会从这样的上下文调用您的回调。

Answer 2

我今天遇到了同样的问题。我想将chrome.storage.local.get与Angular promise模式集成，因为chrome.storage.local.get是异步函数。这就是我的表现：

// service
angular.module('app').factory('STORAGE', function($q) {
    return {
        get: function(key) {
            var deferred = $q.defer();

            chrome.storage.local.get(key, function(data) {
                deferred.resolve(data[key]);
            });

            return deferred.promise;
        },
        set: function(key, value) {
            var deferred = $q.defer();

            var data = {};
            data[key] = value;
            chrome.storage.local.set(data, function() {
                deferred.resolve({});
            });

            return deferred.promise;
        },
        del: function(key) {
            var deferred = $q.defer();

            chrome.storage.local.remove(key, function() {
                deferred.resolve({});
            });

            return deferred.promise;
        }
    }
});

我定义了一个Angular服务调用STORAGE，我可以封装chrome.storage.local。 get，set和del方法。

然后我们可以将STORAGE注入Angular路线resolve部分

// route resolve
...
resolve: {
    hasToken: function(STORAGE) {
        return (STORAGE.get('instagram_access_token')) ? true : false;
    }
}
...

将路径解析参数和STORAGE注入控制器

// controller 
angular.module('app').controller('HomeController', ['$scope', 'hasToken', 'STORAGE',
    function($scope, hasToken, STORAGE) {
        $scope.hasToken = hasToken;

        if ($scope.hasToken) {
            STORAGE.get('profile').then(function(data) {
                $scope.user = data;
            });
        }
    }
]);

它运作良好。

Answer 3

基本上为什么你的代码没有运行是因为你要返回chrome.local.storage，它会让你离开作用域并且get函数永远不会有机会被执行。请参阅chrome API，了解如何操作它与angular的$ http服务

非常相似

Answer 4

如果你在get之前取消注释返回，除了打电话之外你怎么做？

基本上，只要你给出回报＆＃39;

，你就会失去功能

在角度js中，您可以使用以下语法

调用then函数

    $http.get(url).then(function(response){
           //put your callback code here
       })

Angular promise然后回调没有在chrome.storage.local.get上触发

4 个答案: