couchDB와 angular.js를 연결하는 방법은 무엇입니까?

Question

나는이 검색 한하지만 우리는 그것을위한 Node.js를의 도움을해야 angular.js 프레임 워크

또는

직접 CouchDB를 연결할 수있는 경우에 적절한 대답을하지 않았다.

Answer 1

나는 angular.js의 경험, JSON-제공하는 자원을 처리 할 수있는 방법을 가지고 나타나는 Google Buzz example보고가 없지만. 이것이 바로 CouchDB의 기능이기 때문에 node.js가 관련 될 필요는 없다고 생각합니다.

모든 CouchDB를 기능

는 HTTP 요청을 통해 액세스 할 수 있기 때문에 AJAX 호출을 수행하여 필요한 경우는, 오른쪽에 맞게해야한다. angular.service.$resource이 적절한 후보자로 보입니다.

Answer 2

아쉬 빈,이 요청에 대한 감사합니다. 나는이 문제에 너무 투쟁한다.

나는 아직 이런 전체 로컬 호스트 URL 사용하기 때문에, AngularJS와에서 로컬 CouchDB를 전화 $ 리소스를 사용하는 방법을 생각하지 않은

:

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

와 AngularJS와 워드 프로세서 및 예제의 모든 지역 표시를 경로 이름. 그들은 실제로 별도의 웹 서비스에 접근하는 방법을 말하지 않거나 적어도 도움이되는 설명을 찾지 못했습니다. :)

다음은 이해하기 쉬운 jQuery를 사용하는 방법입니다. 이 파일을 couch.js라는 파일에 저장하여 우리의 동물 (개, 고양이 등)의 CouchDB에 연결했습니다. 실제 모듈 ("응용 프로그램") 응용 프로그램에 다른 곳에서 정의되고, 그래서 난 그냥 "응용 프로그램"라는 변수에 넣어 그래서 같은 소파 컨트롤러 추가 :

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

내가 = 콜백을 추가를? 로컬에서 작업하는 동안 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> 

사람은 당기의 jQUery.getJSON 방법을 복제하는 몇 가지 실제 AngularJS와의 $ 자원 코드를 게시 할 수있는 경우 데이터를 CouchDB에서 AngularJS 앱으로 가져 와서 고맙겠습니다.

Answer 3

트릭은 CouchDB를 쿼리를 포함 페이지가 CouchDB를 자체와 동일한 주소와 포트에서 제공해야한다는 것입니다. 이것은 couchdb로 html을 제공하거나 html과 couchdb를 호스팅하는 웹 서버의 우산 역할을하는 프록시를 설치하여 수행 할 수 있습니다.

Answer 4

저는 AngerJS 모듈을 CouchDB 전용으로 조정하여 AngularJS $ 리소스의 접근 방식을 개선 한 CornerCouch라는 AngularJS 모듈을 만들었습니다. AngularJS의 $ http 서비스를 기반으로합니다. 그 방법으로, 특히 애플 리케이션 AngularJS 컨트롤러에서 좋은 깨끗한 자바 스크립트 코드로 끝났다.CouchDB를의 첨부 파일에서 HTML 응용 프로그램을 직접

• 로드 (CouchApp 방식)

• 사용 A를 : 통화를 만들기

  CornerCouch AngularJS Module

  직접 내가 아는까지, 세 가지 옵션 잎 Jetty 프로젝트에 포함 된 투명한 프록시 (Java 앱 스택)

• GET을 통한 액세스 o CouchDB 서버에서 활성화 한 후 JSONP를 사용합니다.

다른 모든 것은 사이트 간 스크립팅 제한에 의해 영향을받지 않습니다.

Answer 5

mongolab 대신 CouchDB를 사용하기 위해 AngularJS 웹 사이트의 예제를 수정했습니다. 여기서 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; 
});