Angular js模板不会显示来自pouch db的变量答案

【问题标题】：Angular js template won`t show variables from pouch dbAngular js模板不会显示来自pouch db的变量
【发布时间】：2014-09-20 19:32:13
【问题描述】：

我正在尝试从 pouchDB 获取数据，我为它编写了工厂。

fac.factory('dbFactory',function(){
var db = new PouchDB('dbname');

return {
    post: function(data){
        db.post({
        title: data
        }, function (err, response) {
            if(err){console.log(err)};
            console.log(response) 
            return response
        });
    },
    get: function(date){
        db.get(date, function(err, doc) {
            if(err){console.log(err)};
            console.log(doc);
            return doc

        });
    },

当我这样做时

$scope.drivers = dbFactory.get('2EC8999B-FC24-4AF6-A171-A43C8414C3D1');

我在 JS 控制台中获取了数据，但在模板中，变量 {{drivers}} 为空。

Object_id: "2EC8999B-FC24-4AF6-A171-A43C8414C3D1"
_rev: "1-5779e6518d996fddf8e38f2c436db506"
drivers: Array[3] 0: "Martin" 1: "Vlada" 2: "Jan" length: 3
__proto__: Array[0]
__proto__: Object

编辑：现在我意识到我只在工厂中“看到”了变量，而不是在控制器中。

【问题讨论】：

标签： angularjs scope pouchdb

【解决方案1】：

在 JavaScript 中，一旦你是异步的，你就需要继续编写异步代码。看看你的get 函数：

get: function(date){
    db.get(date, function(err, doc) {
        return doc
    });
},

return doc 不是从 get 返回，而是从 db.get 返回。您的顶级函数只是一个 void 调用。但是，即使您从异步回调中返回，您仍然会返回 void，因为 JavaScript 同步地评估返回值。我不熟悉 PouchDB 但扫描文档，它看起来只支持Continuation Passing Style。这意味着获得结果的方法是提供回调或围绕 PouchDB 方法创建一个 Promise。以下是如何做到这两点：

回调

get: function(date, callback){
    db.get(date, function(err, doc) {
        // do whatever logic needs to be done beforehand, then...
        if("function" === typeof callback){
            callback.call(null, err, doc);
        }
    });
},

// usage
dbFactory.get('2EC8999B-FC24-4AF6-A171-A43C8414C3D1', function(err, doc){
    $scope.drivers = doc;
});

承诺

// need to include $q dependency in your factory..

get: function(date){
    var deferred = $q.defer();
    db.get(date, function(err, doc) {
        if(err){
            deferred.reject(err);
        } else {
            deferred.resolve(doc);
        }
    });
    return deferred.promise;
},

// usage
dbFactory.get('2EC8999B-FC24-4AF6-A171-A43C8414C3D1').then( 
    function onSuccess(doc){
        $scope.drivers = doc;
    },
    function onError(err){
        $scope.drivers = null;
    });

就我个人而言，我更喜欢 promise 风格。在 Angular 1.2 之前，您可以将 UI 直接绑定到一个 Promise，它会被自动解析。在 1.2 中，您必须选择加入此功能。我相信选择加入将在 1.3 中删除。我更喜欢 Promise 风格的原因是因为你编写的服务和工厂与 Angular 核心库保持相当一致。

【讨论】：

没问题！很高兴我能帮上忙