javascript - コントローラーとサービスと対話するディレクティブを作成するAngular

Question

リファクタリングの真っ最中です。コントローラーによって呼び出されるサービス「myservice」があります。これは、基本的に、再編成データを使用して $scope 変数を設定する get 要求を作成します。

サービスを挿入するウィジェットのディレクティブを作成できるようにしたいのですが、コードを整理する方法がわかりません。ディレクティブで定義された属性を使用して、コントローラー内からサービスを呼び出せるようにしたいと考えています。

私は自分のディレクティブをそのように見せたい..

<mywidget service="MyService" server="http://localhost:8080/" api="abcservice"/>

私のサービスは現在そのように見えます...

 .service('MyService',function($http, $q){
  return{

        getPageData: function(server,api){
            //Creating a deferred object
            var deferred = $q.defer();

            //Calling Web API to fetch data - this is just hacky right now
            $http.get(server+api).success(function(data){
                //Passing data to deferred's resolve function on successful completion
                deferred.resolve(data);
            }).error(function(){
                    //Sending a friendly error message in case of failure
                    deferred.reject("An error occured while fetching items");
                });

            //Returning the promise object
            return deferred.promise;
        }
    }
 }

最後にコントローラ ...ディレクティブ属性から渡されたデータを使用するにはどうすればよいですか?

myapp.controller('MainCtrl',  function($scope, MyService) {   
     $scope.cleanData = function(res){
      // magical things happen including assigning some cleaned data to a controllers scope variable
    }    


    //not sure how to get server and api that i had in the directive
    MyService.getPageData(???????).then(function(res){
        $scope.cleanData(res);
    });

});