【发布时间】:2014-10-14 19:00:27
【问题描述】:
我正在使用 AngularJs 显示由 nodejs 路由“api/getItems”提供的名称列表 返回以下
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);
});
请在这个小提琴here中找到我的html代码和角度代码(app.js)
这段代码看起来非常简单明了。我是 angularjs 的新手,因此我无法弄清楚问题所在。该列表迭代对象的数量,但不显示名称。我尝试使用 Angular Batarang 进行调试,发现以下内容。
有人可以帮我解决我在这里做错的事情吗?非常感谢
在下面添加我的角度代码。
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 sn-p:
<body ng-app="sampleApp">
<div ng-controller="TestController">
<div ng-repeat="item in model.TestList">
<p>Name :</p> {{item.name}}
</div>
</div>
</body>
【问题讨论】:
-
如果您对 Angular 有任何疑问,请在问题中包含 angular 代码。如果您想提供一个包含多个文件的示例,也可以考虑plnkr.co。
-
我什么都没改变,只是 URL;在此处查看工作示例:plnkr.co/edit/T3aHvQzbrgAEoZafdyD1?p=preview
-
@Yoshi 我的 Angular 代码与 html 一起在小提琴中提供
-
@NewtonCode 问题是,每当 jsfiddle 出现故障或链接因其他原因而断开时,您的问题对于未来的访问者将变得无法使用。这就是为什么您应该始终在您的问题 中包含有问题的代码。见:Help Center > Asking: Help others reproduce the problem
-
谢谢@Yoshi,我现在已经包含了角度代码以及问题。您能否提供一些关于为什么 $http.get 在这种情况下不起作用的线索。似乎硬编码 json 工作正常。
标签: javascript json node.js angularjs