问题描述
我只是从AngularJS开始,在使用{{expressions}}从$ http.get获取的JSON中提取数据时遇到了问题。 JSON对象运行正常,因为我能够将其记录到控制台。 但是,当我尝试在view.html中显示它时,表达式为空。 也许只是一些小东西,但我无法弄清楚。
下面的代码段
路由摘要:
$routeProvider
.when('/contacts/:contactId', {
controller: 'ContactController',
templateUrl: 'js/views/contact.html'
})
.otherwise({
redirectTo: '/'
});
控制器:
app.controller('ContactController', ['$scope', '$routeParams', '$http',
function($scope, $routeParams, $http) {
$http.get($routeParams.contactId + '.json').success(function(data) {
$scope.detail = data;
})
.error(function(data) {
return data;
console.log("Failed to get data")
});
$scope.pageClass = 'contact-screen';
}]);
contact.html视图的一部分:
<div class="text-container">
<h2 class="name"> {{ detail.name }} </h2>
<h3 class="subtitle"> "{{ detail.subtitle }}" </h3>
</div>
1楼
您有一个包含用于数据的对象的数组,而不是代码当前所指示的单个对象。
仅显示当前视图中的一项:
$scope.detail = data[0];
但是由于您可能将不止一个使控制器保持不变,并使用ng-repeat
遍历数组
<div class="text-container" ng-repeat="item in detail">
<h2 class="name"> {{ item.name }} </h2>
<h3 class="subtitle"> "{{ item.subtitle }}" </h3>
</div>
或者,因为您在url中具有:contactId
,所以请更改后端以返回单个对象,并使代码保持不变