拉數據轉換成angularjs服務

angular.module('testJsonLoadApp') 
 
    .factory('LoadJsonFactory', function($http) { 
 
    var jsonLoad = { 
 
     fetch: function() { 
 
     return $http.get('../../test.json').then(function(data) { 
 
      return data; 
 
     }); 
 
     }, 
 

 
    }; 
 

 
    return jsonLoad; 
 
    }) 
 
    .controller('MainCtrl', function ($scope, LoadJsonFactory) { 
 
    var a = []; 
 
    LoadJsonFactory.fetch().then(function(items) { 
 
     a = items; 
 
    }); 
 
    $scope.data = a; 
 
    });

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 
<div> 
 
    <ul> 
 
    <li ng-repeat="datum in data">{{datum.id}}</li> 
 
    </ul> 
 
</div>

這裏是JSON文件內容

[{"id": "0","Name": "Items 0", "Description": "Description 0"}, 
{"id": "1","Name": "Items 1", "Description": "Description 1"}, 
{"id": "2","Name": "Items 2", "Description": "Description 2"}]

該變量「a」在控制器是沒有得到與產生的陣列更新來自json文件。但是，如果我使用$ scope變量直接綁定數組，那麼它就可以工作。

LoadJsonFactory.fetch().then(function(items) { 
      $scope.data = items; 
     });

上述代碼有效。

有沒有一種方法可以將它分配給控制器變量，然後將其綁定到範圍變量？

來源

2016-02-24 Vignesh T

任何幫助非常感謝！ –

試試這個'a = items.data' –

嘗試了items.data，但仍然無法獲得數組。 –

此電話爲異步

LoadJsonFactory.fetch().then(function(items) { 
    a = items; 
});

此執行調用完成

$scope.data = a;

所以，不，你不能這樣來做了。 a將在分配後始終爲空$scope.data

但是，如果它適合您，您可以做到這一點，這與您工作的相同，只是更清楚一點。

LoadJsonFactory.fetch().then(onFetch); 


function onFetch(data) { 
    $scope.data = data; 
}

來源

2016-02-24 09:40:42 koox00

實際上，通過綁定工廠的fetch（）方法中的$ scope.data，我將能夠從json文件中獲取並顯示數組。但對我來說問題是：在我的應用程序中，我有一個指令，它有自己的控制器。我需要通過工廠讀取json文件，並將其分配給將在主控制器和指令控制器（同一實例）中使用的數組變量。如果有兩個不同的數組實例，那麼這些值將不會匹配我。 :( –

提出了一個不同的問題，並提出這個問題 – koox00

您可以在服務中的服務響應LoadJsonFactory分配給一個變量，而不是在你的控制器，然後只是把它從任何控制器。

例如：

.factory('LoadJsonFactory', function($http) { 

var jsonResponse = []; 

return { 
    fetch: function() { 
     return $http.get('../../test.json').then(function(data) { 
     jsonResponse = data; 
    }); 
    }, 
    getResponseResult: function() { 
     return jsonResponse; 
    } 
    } 
})

來源

2016-02-24 09:56:58

即使我只是使用'var a;'而沒有聲明它爲一個數組，它不起作用。另外，如果我直接綁定範圍變量'數據'它的功能內的作品。 –

通過在工廠中定義新功能，更新是否適用於您？恐怕它不適合我.. –

它確實對我有用。您需要發佈您的代碼，包括您在控制器中調用它的位置，以便查看是否有錯誤。 –

的問題與您的代碼是LoadJsonFactory的$ HTTP調用是異步的。您的$scope.data = a在調用LoadJsonFactory後立即運行。

我已經做了一個快速的演示，說明這個開放的控制檯，看看我的意思。（我也清理了LoadJsonFactory了一點，所以它更清楚地返回的承諾。）

https://plnkr.co/edit/Ns1iQdvhKT6DXrfjrOjm

承諾的成功運作功能內分配到$ scope.data，因爲在這一點上承諾解決並且該分配觸發更新雙向綁定的摘要。

來源

2016-02-24 21:02:19 bbrown

拉數據轉換成angularjs服務

回答

相關問題