Question

我有一个看起来像这样的控制器：

var PlayersController = function($scope, $http) {
    $http.get('/Players/Index').success(function (data) {
        console.log(data);
        $scope.players = data;
    });
}

PlayersController.$inject = ['$scope','$http'];

我的路由如下：

var KorpenApp = angular.module('KorpenApp', ['ngRoute']);

KorpenApp.controller('HomeController', HomeController);
KorpenApp.controller('PlayersController', PlayersController);

var configFunction = function($routeProvider) {
    $routeProvider
        .when('/Players', { templateUrl: 'Players/Index', controller: PlayersController })
    .otherwise({redirectTo: '/'});
}

configFunction.$inject = ['$routeProvider'];
KorpenApp.config(configFunction);

我的观点（玩家/指数）看起来像这样：

<p>TEST</p>
<p>{{players.length}}</p>
<ul ng-repeat="player in players">
    <li ng-repeat="prop in player">
        {{prop}}
    </li>
</ul>

播放器控制器中的控制台日志记录了一个包含5个对象的数组。这些对象包含我尝试显示的许多属性。但是，我的视图仅显示：

[object Object]，[object Object]，[object Object]，[object Object]，[object Object]

看来视图中的所有内容都被忽略了，所以很明显我做错了什么。我会想到至少包含＆＃34; TEST＆＃34;即使玩家阵列出现问题也会显示。所以我的两个问题是：

为什么我的视图显示＆＃34; [object Object]，[object Object]，[object Object]，[object Object]，[object Object]＆＃34; ？
为什么我没有把这些东西放在玩家/指数节目中？

Answer 1

因为这是对象的打印方式。如果需要此对象的json表示，请使用
```
console.log(angular.toJson(data));
```
很难说。也许视图实际上不在此URL。查看浏览器开发工具的“网络”选项卡，查看返回的内容。

Answer 2

您需要执行以下操作：

var PlayersController = function($scope, $http) {
    $http.get('/Players/Index').success(function (data) {
        console.log(data);
        $scope.players = data;
    });
}

PlayersController.$inject = ['$scope','$http'];

在视图中：

<p>TEST</p>
<p>{{players.length}}</p>
<ul ng-repeat="player in players">
    {{player.prop}}
</ul>

在对象数组上应用ng-repeat显示[对象对象]

2 个答案: