I am using AngularJs to display list of names provided by a nodejs route 'api/getItems' which returns following
router.get('/getItems',function(req,res,next){
var model = [{"_id":"53f4cde40864fca70c2434cf","name":"John Smith"},
{"_id":"23f4bde40864fba70c2434cf","name":"Smith John"},
{"_id":"592f4cde40864fca70c2434cf","name":"Albert Test"}];
res.json(model);
});
Please find my html code and angular code ( app.js) in this fiddle here
This code appears to be pretty straightforward and simple . I am new to angularjs and hence i cant make out what is the issue. The list iterates for the number of objects but does not display name.I have tried debug using Angular Batarang and found the following.
Can someone help me with what i am doing wrong here? Thank you very much
adding my angular code below.
var app = angular.module('sampleApp', []);
app.factory('TestService', function ($http, $q) {
return ({
getItems : getItems
});
function getItems(){
var request = $http({
method: "Get",
url: "api/getitems"
});
return( request.then( handleSuccess, handleError ) );
}
function handleError( response ) {
if (! angular.isObject( response.data ) ||! response.data.message) {
return( $q.reject( "An unknown error occurred." ) );
}
return( $q.reject( response.data.message ) );
}
function handleSuccess( response ) {
return( response.data );
}
});
app.controller('TestController', ['$scope', 'TestService', function ($scope, TestService) {
$scope.model= [];
$scope.model.TestList= [];
loadRemoteData();
function loadRemoteData(){
TestService.getItems().then(function(data){
applyRemoteData(data);
});
}
function applyRemoteData( WorkItems ) {
$scope.model.TestList = WorkItems;
}
}]);
html snippet :
<body ng-app="sampleApp">
<div ng-controller="TestController">
<div ng-repeat="item in model.TestList">
<p>Name :</p> {{item.name}}
</div>
</div>
</body>
I checked with your jsfiddle , there will be a problem with your $http.get(url);
as i see your are not getting correct promise object check with get call.
So i tried with mock data By forking and did few changes in jsfiddle and removed some script tags in html.
here is the updated jsfiddle which works fine which your looking for