Angular動態更改加載的數據

Question

我試圖動態更改我的數據，而無需一直向服務器請求。

這裏是我當前的代碼：

$scope.total_earned =() => { //ng-click function from frontend 
     splice(); 
     loadChartData(1); 
}; 
$scope.total_cashback =() => { //ng-click function from frontend 
    splice(); 
    loadChartData(2); 
}; 

loadChartData(1); 

function splice(){ 
    $scope.chartConfig.series = []; 
} 
function loadChartData(type) { 
    Vendor.get({id: vendorId}).$promise.then((data) => { 
     $scope.datePicker = {startDate: moment(data.metadata.start_date), endDate: moment(data.metadata.end_date)}; 
     $scope.data = data; 
     for (var key in data) { 
      var arr = []; 
      var arr2 = {}; 
      if (data.hasOwnProperty(key)) { 
       if (key != 'metadata') { 
        var obj = data[key]; 
        $.map(obj, function (el, index) { 
         var date = moment.utc(el.date).valueOf(); 
         var value = 0; 
         if (type == 1) { 
          value = el.total_amount; 
         } 
         else if (type == 2) { 
          value = el.total_earned; 
         } 
         else if (type == 3) { 
          value = el.total_spent; 
         } 

         arr.push([date, parseInt(value)]); 
         arr2[key] = arr; 
        }); 
        $scope.chartConfig.series.push(
         { 
          name: key, 
          type: 'line', 
          data: arr2[key], 
          animation: true 
         } 
        ); 
       } else { 
        break; 
       } 
      } 
     } 
    }); 

} 

我的JSON輸出：

{ 
    "vendor1": [{ 
     "total_earned": "313028", 
     "total_spent": "92231", 
     "total_amount": "3222509", 
     "date": 1450828800 
    }, { 
     "total_earned": "281966", 
     "total_spent": "87324", 
     "total_amount": "2906973", 
     "date": 1450915200 
    }, { 
     "total_earned": "265567", 
     "total_spent": "82190", 
     "total_amount": "2737860", 
     "date": 1451001600 
    }], 

    "vendor2": [{ 
     "total_earned": "114122", 
     "total_spent": "41223", 
     "total_amount": "512123", 
     "date": 1450828800 
    }, { 
     "total_earned": "125613", 
     "total_spent": "16678", 
     "total_amount": "9764231", 
     "date": 1450915200 
    }, { 
     "total_earned": "12546", 
     "total_spent": "16164", 
     "total_amount": "17758", 
     "date": 1451001600 
    }] 
} 

的問題是，每次我打電話total_earned或total_cashback功能它總是加載到服務器。我知道它總是調用loadChartData函數並運行服務器。我試圖將數據寫入$scope.data，但每次我將它稱爲函數外部時，數據都是undefined。

任何解決方案，所以我可以保持更改基於類型的數據，而無需將其加載到服務器？

Answer 1

我不確定你到底在想什麼，但是你應該把調用的結果存儲在一個變量中，然後你可以隨時訪問它作爲一個簡略。例如：

var data = loadChartData(type); 
data.then(function(values) { 
    // do something with values 
}); 

的問題是你返回一個承諾，而不是一個值，每次你打電話給你loadChartData功能您正在擷取來自服務器的結果，並返回一個新的承諾。你可以簡單地重用原來的承諾。如果您對角度承諾的瞭解不多，請參閱here。

您需要將數據獲取調用與業務邏輯分開，這樣，您可以通過一次調用獲取所有適當的數據，然後以任何希望的方式使用它，如下所示：

function loadChartData() { 
    return Vendor.get({id: vendorId}).$promise; 
}); 
var data = loadChartData(); 
data.then(function(data) { 
    //do something with data 
}); 
data.then(function(data) { 
    //do something else with data 
});