如何使用AngularJS在View中显示JSON的API?

时间:2016-08-24 15:47:24

标签: angularjs json

我创建了一个API,我从URL调用,在点击API时我收到了响应。这是我的控制器。

adminApp.controller('PollController', function($scope,$window,$timeout, $routeParams, $http, $location) {   
         var story_id = 1;  
          $http({
            method: 'get',
            url: ""+story_id,
          }).
          success(function(response) {
            // console.log(response);
            //displayMessage('Sent','200px');
            $scope.poll = response.polls;
            console.log("======================");
            console.log(response.polls);
            console.log("======================");
            console.log(response.polls[0].options[0].votes);
          }).
          error(function(response) {
              console.log(response || "Request failed");
          });



});

当我点击API时,我得到以下内容。

{
  "num_polls": 1,
  "polls": [
    {
      "total_votes": 2,
      "options": [
        {
          "votes": "2",
          "id": "2"
        }
      ],
      "id": "3"
    }
  ]
}

我正在尝试使用控制台日志访问民意调查[0] .options [0] .vote工作正常,但如何使用AngularJS在视图中显示它?

我尝试了这个但是没有用。那么如何从API访问详细信息?

<tr ng-repeat="tableDetail in poll">
<td ng-bind="tableDetail.polls[0].options[0].votes"></td>
<td ng-bind="tableDetail.id "></td>
</tr>

2 个答案:

答案 0 :(得分:0)

使用这种方式

<tr ng-repeat="tableDetail in poll">
<td>
{{tableDetail.polls.options.votes}}
</td>
<td> {{tableDetail.id}} </td>
</tr>

答案 1 :(得分:0)

我会尝试以下操作,因为使用ng-repeat迭代数组的项目,因此您不必使用索引:

<tr ng-repeat="tableDetail in poll">
    <td>{{tableDetail.options[0].votes}}</td>
    <td>{{tableDetail.id}}</td>
</tr>