Question

我刚刚开始使用AngularJS，并且使用{{expressions}}从JSON获取数据时遇到问题我将使用$ http.get获取数据。 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>

Answer 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>

或者，因为您在网址中有:contactId，所以更改后端以返回单个对象并保持代码完全相同

AngularJS - 无法显示JSON中的内容

1 个答案: