वेब सेवा प्रतिक्रियाओं

Question

मैं दो वेब सेवाओं है संयोजन AngularJS

[ 
    { 
     "id": "1", 
     "headline": "some text", 
     "body": "some text", 
     "authorId": "2" 
    }, 
    { 
     "id": "2", 
     "headline": "some text", 
     "body": "some text", 
     "authorId": "1" 
    } 
] 

और एक दूसरे को देता है एक इस तरह "लेखक", एक आईडी दिया:

{ 
    "id": "1", 
    "name": "Test Name", 
    "email": "test@test.com", 
    "photo": "path/to/img" 
} 

मैं दोनों को गठबंधन करना चाहता हूं, इसलिए मैं एक लेख अवलोकन सूची में लेखकों का नाम और फोटो प्रदर्शित कर सकता हूं।

इस तरह

:

[ 
    { 
     "id": "1", 
     "headline": "some text", 
     "body": "some text", 
     "authorId": "2", 
     "author_info": { 
      "id": "2", 
      "name": "Another Test Name", 
      "email": "test2@test.com", 
      "photo": "path/to/img" 
     } 
    }, 
    { 
     "id": "2", 
     "headline": "some text", 
     "body": "some text", 
     "authorId": "1" 
     "author_info": { 
      "id": "1", 
      "name": "Test Name", 
      "email": "test@test.com", 
      "photo": "path/to/img" 
     } 
    } 
] 

मैं एक "लेख" सेवा है कि सेवा लौटने से पहले लेख को हासिल करेगा, लेकिन क्या इसी तरह की "लेखक" से लेखक की जानकारी के साथ वापस आ JSON समृद्ध बनाने के लिए सबसे अच्छा तरीका है है "लेख" सेवा आउटपुट?

factory('Authors', ['$http', function($http){ 
    var Authors = { 

     data: {}, 

     get: function(id){ 
      return $http.get('/api/authors/' + id + '.json') 
       .success(function(data) { 
        Authors.data = data; 
       }) 
       .error(function() { 
        return {}; 
       }); 
     } 
    }; 

    return Authors; 
}]). 

factory('Articles', ['$http', 'Authors', function($http, Authors){ 
    var Articles = { 

     data: {}, 

     query: function(){ 
      return $http.get('/api/articles.json') 
       .success(function(result) { 
        Articles.data = result; // How to get the author info into this JSON object??? 
       }) 
       .error(function() { 
        Articles.data = []; 
       }); 
     } 
    }; 
    return Articles; 
}]) 

कृपया मुझे यह भी बताएं कि यह एक पूरी तरह से गलत दृष्टिकोण है या नहीं। :)

Answer 1

एक विकल्प सर्वर पर इस डेटा को गठबंधन करना है, शायद एक अलग जेसन फ़ाइल बनाना। यह क्लाइंट-साइड को सरल बना देगा और दो के बजाय केवल एक HTTP अनुरोध की आवश्यकता होगी।

यदि आप दोनों सेवाएं (जो एक बुरा दृष्टिकोण नहीं है) रखते हैं तो आप एक को आग लग सकते हैं, जवाब की प्रतीक्षा कर सकते हैं और दूसरे को आग लगा सकते हैं। हो सकता है कि ऐसा Articles पहले और उसके बाद Authors:

Articles.get(function (articles) {     
      $scope.articles = articles; 
      //fire query for Authors 
      Authors.query(function (authors) { 
       $scope.authors= authors; 
       //combine both articles and authors 
       combineData(articles, authors);      
      }) 
}); 

यहाँ समारोह है कि डेटा को जोड़ती है:

function combineData(articles, authors){ 
    $.each(articles, function (i, article) { 
     //find author 
     var author = $.grep(authors, function(a, j){ 
        return a.id == article.authorId; 
        }); 
     //set article's author 
     article.author_info = author; 
    }); 
} 

सूचना है कि इस विन्यास के साथ अपने लेख ($scope.articles की स्थापना करके) प्रस्तुत करना होगा भी Authors.query

Answer 2

पर कॉल करने से पहले एपीआई के साथ संवाद करते समय, मैं आपके सेक्टर को संरक्षित करने के लिए निम्नलिखित दृष्टिकोण की अनुशंसा करता हूं (advised by Misko Hevery के रूप में) rvices:

// Author model/service 
    angular.module('myApp').factory('Author', function($http) { 
     var Author = function(data) { 
     angular.extend(this, data); 
     }; 

     Author.get = function(id) { 
     return $http.get('/authors/' + id).then(function(response) { 
      return new Author(response.data); 
     }); 
     }; 

     return Author; 
    }); 

    // Article model/service 
    angular.module('myApp').factory('Article', function($http) { 
     var Article = function(data) { 
     angular.extend(this, data); 
     }; 

     Article.query = function() { 
     return $http.get('/articles/').then(function(response) { 
      var articles = []; 
      angular.forEach(response.data, function(data){ 
      articles.push(new Article(data)); 
      }); 
      return articles; 
     }); 
     }; 

     return Article; 
    }); 

    // Your controller 
    angular.module('myApp') 
     .controller('Ctrl' 
     ,[ 
      '$scope' 
      ,'Article' 
      ,'Author' 
      ,function($scope, Article, Author){ 
      Article.query() 
       .then(function(articles){ 
       $scope.articles = articles; 
       attachAuthors(articles); 
       }); 

      function attachAuthors(articles){ 
       angular.forEach(articles, function(article){ 
       Author.get(article.authorId) 
        .then(function(author){ 
        article.author = author; 
        }); 
       }); 
      } 

      } 
     ] 
    ); 

लेकिन यकीन है कि के लिए, मैं भी अलग कॉल में सभी इस डेटा प्राप्त करने में के खिलाफ सलाह देंगे। इसके बजाय, यदि संभव हो, तो आपको अपना एपीआई संयुक्त संयुक्त JSON वापस कर देना चाहिए। सर्वर-साइड संयोजन कई गुना तेजी से होगा।

Answer 3

जेएसओजी देखें। यह इस तरह की चीजें करने के लिए एकदम सही है। जावा, पायथन, जावास्क्रिप्ट और रूबी के लिए वर्तमान में सर्वर कार्यान्वयन हैं। क्लाइंट जावास्क्रिप्ट पक्ष पर, आप बस JSOG.decode (ऑब्जेक्ट) को कॉल करें। मैं इसे कोणीय के साथ भारी मात्रा में उपयोग करता हूं।

https://github.com/jsog/jsog