Question

我已经搜索了这个，但是如果我们可以将couchDB直接与angular.js框架连接，则没有得到正确答案

或

我们必须为node.js提供帮助。

Answer 1

我创建了一个名为CornerCouch的AngularJS模块，该模块改进了方法通过专门为CouchDB定制AngularJS $资源。它基于AngularJS中的$ http服务。我最终得到了干净的JavaScript代码，特别是在特定于应用程序的AngularJS控制器中。

CornerCouch AngularJS Module

据我所知，直接拨打电话有三个选项：

直接从CouchDB附件加载html应用程序（CouchApp方法）
使用Jetty项目中包含的透明代理（Java app stack）
仅通过GET访问，但在CouchDB服务器上启用后使用JSONP

其他所有内容都无法通过跨站点脚本限制获得。

Answer 2

虽然我没有angular.js的经验，但查看Google Buzz example它似乎有办法处理提供JSON的资源。由于这正是CouchDB的原因，我认为不需要涉及node.js。

所有CouchDB功能都可以通过HTTP请求访问，因此如果需要，可以通过执行AJAX调用来适应它。 angular.service.$resource看起来是合适的候选人。

Answer 3

阿什文，谢谢你这么问。我也很难解决这个问题。

我还没有想出如何使用$ resource从AngularJS调用本地CouchDB，因为它使用完整的localhost URL，如下所示：

http://localhost:5984/<dbname>/_all_docs

并且所有AngularJS文档和示例都显示了本地路径名。他们并没有真正告诉人们如何联系单独的网络服务，或者至少我没有找到有助于的解释：）

这是一种使用jQuery的方法，这对我来说更容易理解。我把它放在一个名为couch.js的文件中 - 连接到我们的小动物（狗，猫等）的CouchDB。实际模块（“app”）在应用程序的其他地方定义，所以我只是把它放在一个名为“app”的变量中，并添加了一个Couch控制器，如下所示：

(function () {
    'use strict';
    var app = angular.module('app');
    app.controller('CouchCtrl', function ($scope,$http,$resource) {
        var all_critters = 'http://localhost:5984/critters/_all_docs?callback=?';
        $.getJSON(all_critters, function(json) {
            $scope.$apply(function(){
                $scope.all_critters = json;
            });
        });
        $scope.getAllCritters = function() {
            return $scope.all_critters;
        };
    });
}());

我添加了？callback =？我在本地工作时为JSONP避免了浏览器的localhost安全问题，因此我在CouchDB首选项中设置了JSONP = true。

在html页面中，只需将crittersDB置于绑定中即可查看此调用的结果：

<ul ng-controller="CouchCtrl">
    <h5>Critters</h5>
    <p>There are currently {{all_critters.total_rows}} critters.</p>
    <li ng-repeat="(key,value) in all_critters">
        {{key}} - {{value}}
    </li>
</ul>

如果有人可以发布一些实际的AngularJS $资源代码来复制这种将数据从CouchDB拉入AngularJS应用程序的jQUery.getJSON方式，我会很感激。

Answer 4

诀窍是，包含对couchdb的查询的页面必须从与couchdb本身相同的地址和端口提供。这可以通过使用couchdb提供html，或者安装一个代理，作为托管html和couchdb的Web服务器的伞来实现。

Answer 5

我已经修改了AngularJS网站上的示例，使用CouchDB而不是mongolab。在这里查看jsfiddle http://jsfiddle.net/WarwickGrigg/dCCQF/和github存储库https://github.com/telanova/angularjs-couchdb。我是一个有角度的新手：我觉得让我的头脑满满资源是一件很困难的事情，但它似乎运作良好。

$scope.projects = ProjectCouch.get({q:'_all_docs', include_docs: 'true', limit: 10});

angular.module('CouchDB', ['ngResource']).
    factory('ProjectCouch', function($resource) {
        var ProjectCouch = $resource(':protocol//:server/:db/:q/:r/:s/:t',
                                     {protocol: 'http:', server: 'localhost:5984', db:'projects'}, {update: {method:'PUT'}   
                           }
   ); 

   ProjectCouch.prototype.update = function(cb) {
    return ProjectCouch.update({q: this._id},
        this, cb);
  };

  ProjectCouch.prototype.destroy = function(cb) {
      return ProjectCouch.remove({q: this._id, rev: this._rev}, cb);
  };

  return ProjectCouch;
});

如何使用angular.js连接couchDB？

5 个答案: