Angularjs从网址获取Json

时间:2016-09-13 02:48:59

标签: javascript angularjs json

第一次尝试获取json数据并使用AngularJS将其显示到我的应用程序时,未显示任何数据,这是我的代码实现

HTML                    

<div ng-app="myApp" ng-controller="customersCtrl"> 

<table>

    <td>{{ x.id }}</td>
    <td>{{ x.title }}</td>

</table>

</div>

</body>
</html>

脚本

<script>
var app = angular.module('myApp', []);
app.controller('customersCtrl', function($scope, $http) {
    $http.get("http://example.com/api/get_page_index/")
    .then(function (response) {$scope.names = response.data.pages;});
});
</script>

来自网址的Json内容

 {
      "status": "ok",
      "pages": [
        {
          "id": 2,
          "type": "page",
          "slug": "sample-page",
          "url": "http:\/\/example.com\/",
          "status": "publish",
          "title": "example page",
          "content": "",
          "excerpt": "",
          "date": false,
          "modified": "2016-08-09 17:28:01",
          "comments": [],
          "attachments": [],
          },

1 个答案:

答案 0 :(得分:1)

你可以这样做,

 <table>
    <thead>
      <tr>
        <th ng-repeat="(header, value) in results[0]">
          {{header}}
        </th>
      </tr>
    </thead>
    <tbody>
      <tr ng-repeat="row in results">
        <td ng-repeat="cell in row">
          {{cell}}
        </td>
      </tr>
    </tbody>
  </table>

WORKING DEMO