呼叫使用AngularJS

我有以下的HTML表單相同$ http.get（）在2個不同的指令：

<div simple-chart chart-data="lineData"></div>

這是掛接像這樣一個指令：

mist.directive("simpleChart", function($window, $http){ 
    return{ 
     restrict: "EA", 
     template: "<svg width='750' height='200'></svg>", 
     link: function(scope, elem, attrs){ 
      function drawLineChart() { 
       //initilize the line chart 
      } 
      $http.get("myurl") 
      .success(function(data, status, headers, config){ 
       drawLineChart(); 
      }) 
     }} 
    });

是否有可能無需再次調用它來創建使用從$ http.get（「myurl」）中的數據的另一個指令？
是否可以使$ http.get（「myurl」）通用，以便可以通過不同的指令調用它？
我可以使用類似的東西嗎？ Can't get correct return value from an jQuery Ajax call

來源

2015-06-11 c f

使用服務/工廠。 – kwangsa

您可以創建一個返回$ http.get（'myurl'）的服務，並將其作爲依賴添加到您的指令中。

mist.factory('dataService', function ($http) { 
    var dataService= {}; 
    dataService.getData = function(){ 
     return $http.get('myurl'); 
    } 
    return dataService; 

}); 

mist.directive("simpleChart", function($window, dataService){ 
return{ 
    restrict: "EA", 
    template: "<svg width='750' height='200'></svg>", 
    link: function(scope, elem, attrs){ 
     function drawLineChart() { 
      //initilize the line chart 
     } 
     dataService.getData() 
     .success(function(data, status, headers, config){ 
      drawLineChart(); 
     }) 
    }} 
});

來源

2015-06-11 07:20:38 Saurav

您可以將您的http調用包裝到服務中，並使用類似angular-cache的緩存來響應服務器。

來源

2015-06-11 05:36:58

因爲我是初學者，所以我發現angular-cache對我來說太高級了，但是我確實在讀取了$ cacheFactory.Cache，而且這似乎是我可以用來代替的東西。 –

由於我使用AngularJS1.3，我需要使用

  mist.factory('dataService', function ($http) { 
      return { 
       getData: function() { 
        //since $http.get returns a promise, 
        //and promise.then() also returns a promise 
        //that resolves to whatever value is returned in it's 
        //callback argument, we can return that. 
        return $http.get('http://url.com').then(function (result) { 
         return result.data; 
        }); 
       } 
      }; 
     }); 

     mist.directive("simpleChart", function ($window, dataService) { 
      return{ 
       restrict: "EA", 
       template: "<svg width='750' height='200'></svg>", 
       link: function (scope, elem, attrs) { 
        function drawLineChart() { 
         //initilize the line chart 
        } 
        dataService.getData().then(
          function (data) { 
           drawLineChart(); 
          }, 
          function (err) { 
           console.log("Sorry we encountered an error " + err); 
          } 
        ); 
       }}; 
     });

來源：http://www.benlesh.com/2013/02/angularjs-creating-service-with-http.html

來源

2015-07-01 02:54:34

呼叫使用AngularJS

回答

相關問題