El servicio angular que contiene http get call no funciona con ng-repeat
Tengo un controlador angular que llama a un servicio. El servicio es responsable de devolver los datos de un archivo json.
controlador:
function projectController($scope, ajaxServices) {
$scope.projects = ajaxServices.getProjects();
}
Servicio:
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"
En la función de éxito, puedo ver los datos devueltos en el registro de la consola, pero si intento devolver los datos, el elemento ul-repeat en mi página está vacío. En el mismo servicio, si simplemente devuelvo los mismos datos registrados a la consola codificados (fuera de la función de éxito, por supuesto que funciona bien).
¿Cómo puedo devolver los datos a la repetición ng usando mi llamada ajax?
Soy tan nuevo en Plunker como Angular pero aquí está mi intento de un Plunk:http://plnkr.co/edit/ALa9q6