如何將couchDB與angular.js連接？

7

雖然我沒有angular.js的經驗，看着它似乎有一個方法來處理JSON-提供資源Google Buzz example。由於這正是CouchDB的特徵，我認爲不需要涉及node.js。

所有CouchDB的功能可以通過HTTP請求進行訪問，所以它應該適合權，必要時做AJAX調用。 angular.service.$resource看起來是合適的人選。

2011-07-01 16:16:27

3

Ashvin，感謝要求這一點。我也爲這個問題而努力。

我還沒有想出如何使用$資源從AngularJS調用本地CouchDB的，因爲它採用了全本地主機URL是這樣的：

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

，所有的AngularJS文檔和示例顯示當地路徑名。他們沒有真正告訴人們如何接觸到一個單獨的Web服務，或者至少我還沒有找到一個解釋，幫助:)

下面是使用jQuery的方式，這是我更容易理解。我把它放在一個名爲couch.js的文件中 - 連接到我們的小動物（狗，貓等）的CouchDB。實際的模塊（「APP」），在應用程序其他地方定義，所以我只是把它放在一個名爲「應用程序」的變量，並增加了牀控制像這樣：

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

我加入了回調=？爲了避免本地工作時瀏覽器出現localhost安全問題的JSONP，所以我在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 $資源代碼複製拉動這個jQUery.getJSON方式從CouchDB到AngularJS應用程序的數據，我會很感激。

來源

2012-09-17 02:41:38 noogrub

1

訣竅是，你的頁面，包括查詢到的CouchDB必須從同一個地址和端口的CouchDB本身提供服務。這可以通過服務通過CouchDB的你的HTML，或通過安裝將充當保護傘主辦html和CouchDB的兩個您的Web服務器的代理來實現。

來源

2012-09-17 06:36:20

18

我已經創建了一個名爲CornerCouch的AngularJS模塊，它通過專門爲CouchDB定製它來改進AngularJS $資源的方法。它基於AngularJS中的$ http服務。我以這種方式結束了非常乾淨的JavaScript代碼，尤其是在特定於應用程序的AngularJS控制器中。

CornerCouch AngularJS Module

使呼叫直接離開三個選項，據我所知：

從CouchDB的attachement裝入的HTML應用程序直接（CouchApp方法）
使用作爲包含在碼頭項目透明代理（Java應用程序堆棧）
通過GET o允許NLY，但使用JSONP，使其CouchDB的服務器

其他的一切就不會通過跨站點腳本的限制得到了。

來源

2012-12-13 01:15:26 eddelplus

+0

由於AngularJS在1.6+版本中已經移除了對$ http.success（）和$ http.error的支持，因此最近停止工作。我提出了一個問題。 –

0

我已經修改了AngularJS網站上的例子，而不是使用mongolab CouchDB的。看到這裏的jsfiddle和http://jsfiddle.net/WarwickGrigg/dCCQF/這裏https://github.com/telanova/angularjs-couchdb github上存儲庫。我是一個新手的角度：我發現這是一個鬥爭，讓我的頭一輪$資源，但它似乎運作良好。

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

來源

2013-05-12 22:06:15 Warwick

如何將couchDB與angular.js連接？

回答

相關問題