Serviço angular contendo chamada get http não funcionando com ng-repeat
Eu tenho um controlador angular que chama um serviço. O serviço é responsável por retornar dados de um arquivo json.
controlador:
function projectController($scope, ajaxServices) {
$scope.projects = ajaxServices.getProjects();
}
serviço:
projectManagerApp.factory('ajaxServices', function ($http) {
return {
getProjects : function () {
$http.get('projects.json', { data: {} }).success(function (data) {
if (window.console && console.log) {
console.log("objects returned: " + data.length); // shows # of items
}
return data //nothing ng-repeated, no console errors.
})
// Exact same data from json file hard-coded, works fine
// when not commented out.
// return [{ "id": 1, "name": "Project 1 }, { "id": 2, "name": "Project 2" }]
}
}
});
html:ng-repeat="project in projects"
Na função success eu posso ver os dados retornados no log do console, mas se eu tentar retornar os dados, o elemento ng-repeat ul na minha página estará vazio. No mesmo serviço, se eu simplesmente retornar os mesmos dados registrados para o console codificado (fora da função de sucesso, é claro que funciona muito bem).
Como posso retornar os dados para o ng-repeat usando minha chamada ajax?
Eu sou tão novo em Plunker quanto sou Angular, mas aqui está minha tentativa em um Plunk:http://plnkr.co/edit/ALa9q6