Question

如何从[TITLE]中显示给定JSON的联赛冠军？其他一切都很好，但我希望它出现在联盟类别中。

我的HTML：

    <div ng-controller="LeaguesCtrl">
        <div ng-repeat="league in leagues">
            League:  {{[TITLE]}}
            <table>
                <tr ng-repeat="match in league">
                    <td>{{match.home_team}}</td>
                    <td>-</td>
                    <td>{{match.away_team}}</td>
                    <td><a href="#">{{match.home_odds}}</a></td>
                    <td><a href="#">{{match.draw_odds}}</a></td>
                    <td><a href="#">{{match.away_odds}}</a></td>
                </tr>
            </table>
            <br />
        </div>
    </div>

我的JSON：

{
  "UEFA Champions League": [
    {
      "id": 152494,
      "home_team": "APOEL Nicosia",
      "home_short": "",
      "away_team": "Paris SG",
      "away_short": ""
    },
    {
      "id": 152519,
      "home_team": "Chelsea",
      "home_short": "",
      "away_team": "Maribor",
      "away_short": ""
    }
  ],
  "Barclays Premier League": [
    {
      "id": 126938,
      "home_team": "Arsenal",
      "home_short": "",
      "away_team": "Hull",
      "away_short": ""
    },
    {
      "id": 126942,
      "home_team": "Manchester C",
      "home_short": "Man C",
      "away_team": "Tottenham",
      "away_short": "Man C"
    }
  ]
}

我的AngularJS控制器：

myApp("LeaguesCtrl", function($scope, $http) {
  $http.get('http://api.odds24.com/best-odds?user=dev&leagues=SOCENGPRE,SOCINTCHL,SOCESPPRI').
    success(function(data, status, headers, config) {
      $scope.leagues = data;
    });
});

Answer 1

你必须在ng-repeat中指定，就像这样;

<div class="col-lg-12" ng-controller="LeaguesCtrl">
    <div ng-repeat="(key, league) in leagues">
        League:  {{key}}
        <table>
            <tr ng-repeat="match in league">
                <td style="padding: 0 5px">{{match.home_team}}</td>
                <td style="padding: 0 5px">-</td>
                <td style="padding: 0 5px">{{match.away_team}}</td>
                <td style="padding: 0 5px; text-align: right"><a href="#">{{match.home_odds}}</a></td>
                <td style="padding: 0 5px; text-align: right"><a href="#">{{match.draw_odds}}</a></td>
                <td style="padding: 0 5px; text-align: right"><a href="#">{{match.away_odds}}</a></td>
            </tr>
        </table>
        <br />
    </div>
</div>

然后使用{{key}}。

这是plunker。

Answer 2

您只需使用ng-repeat中的键/值选项。所以它看起来像这样：

<div ng-repeat="name, detail in league">

然后，您只需使用{{name}}引用它。

ng-repeat页面文档中的更多信息。

在AngularJS中显示JSON数组中的键值

2 个答案: