2016-11-17 7 views
1

大規模アプリケーションでコードを分離する苦労の中で、私は角形の定型文を実装しました。私が他のJavascriptフレームワークと同じようにAngularを使った経験はあまりありませんでしたが、私はこのメソッドの入力をしたいと思います。AngularJSのAPIエンドポイントをインターフェイスするためのサービスの使用

エンドポイントで作業すると、物事が面倒になり、コードがAngularJsで繰り返しESPを開始します。他の人のプロジェクトに取り組んで、私は見ての病気だった...

$http({ 
    method: 'GET', 
    url: '/posts' 
}).then(function successCallback(response) { 
    // code 
}, function errorCallback(response) { 
    // code 
}); 

だから私は基本的にHTTPコンポーネントのインタフェースとが、所定の位置に私たちの現在の安らかな基準を適用するコンポーネント(正しくHTTPステータスを処理)、スコープ、ローカルストレージを構築エンドポイントを厳密に記述するエンドポイントインターフェイスのサービスを実装する方法と、エンドポイントがアプリケーションにどのように適合するかを組み合わせたものです。

angular.module('Ripple').service('postModel', [function() { 

'use strict'; 

return { 

    /** 
    * Rest Endpoint interface 
    * @type {Object} 
    */ 
    _rest: { 
     getPosts: { 
      url: 'http://localhost:3000/posts', 
      method: 'GET', 
      scopeUpdate: 'posts', 
      localStorage: false, 
      params: { 
       // Endpoint params 
      } 
     }, 
     getPost: { 
      url: 'http://jsonplaceholder.typicode.com/posts/', 
      method: 'GET', 
      scopeUpdate: 'post', 
      localStorage: false, 
      pagination: false, 
      params: { 
       id: 1 
      } 
     }, 
     getError: { 
      url: 'https://demo0079948.mockable.io/posts', 
      method: 'GET', 
      scopeUpdate: 'post', 
      localStorage: false, 
      pagination: false, 
      params: { 
       // none 
      } 
     }, 
    }, 

    /** 
    * Returns rest objects and allows to extend the params property 
    * @param {string} method 
    * @param {object} options 
    * @return {object} 
    */ 
    endPoint: function(endPointMethod, options) { 
     var defaults = this._rest[endPointMethod]; 
     $.extend(defaults.params, options); 
     return defaults; 
    } 

} 

restHttpComponent

restHttpComponent.request(postModel.endPoint('getPosts', { 
    dateFrom: currentDate 
})); 

と使用法は誰もがこれをやってから、任意のネガを見ることができますか?

+1

私はあなたのためにコードレビューを行いませんが、原則的に、これは動作します。私も同じことをやっていますが、より深いエンドポイントを呼び出すことができる方法をチェーンしています。 'service.one( 'topic'、1).one( 'subject'、33).get( 'comment'、3)'。参考までに、同じことをして使いやすいRestangularもあります。 – trichetriche

+0

あなたのフィードバックに感謝しています –

答えて

関連する問題