如何在angular js中使用嵌套的json进行http(ng-repeat)操作?

时间:2019-01-23 15:14:29

标签: angularjs json http

仅当我的JSON不嵌套时,我的代码才有效。如果数据之间没有“,”并且我仅使用一个JSON块,则它起作用。

我的角度:

<html>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.9/angular.min.js"> 
</script>
  <body>
    <div ng-app="myApp" ng-controller="myCtrl"> 

      <table border="1">
        <tr ng-repeat="thing in info" ng-if="thing.color!=null">
          <td>{{thing.color}}</td>
          <td>{{thing.category}}</td>
          <td>{{thing.type}}</td>
        </tr>
        <tr ng-repeat="thing in info" ng-if="thing.detail!=null">
          <td>{{thing.detail}}</td>
          <td>{{thing.item}}</td>
          <td>{{thing.value}}</td>
        </tr>
      </table>

      <button class="button" ng-click="click()">Button 1</button>
      <script>
            var app = angular.module('myApp', []);
            app.controller('myCtrl', function($scope, $http) {

                $scope.click = function() {
                    $http.get("json.js").then(function (response) {
                    $scope.info=response;

                    });
                };

            });
      </script>
    </div>

  </body>
</html>

还有我的JSON

[
  {
    "color": "black",
    "category": "hue",
    "type": "primary"
  },
  {
    "detail": "white",       
    "item": "red",                                              
    "value": "silver"
   }
 ]

谢谢

1 个答案:

答案 0 :(得分:0)

请使用$scope.info=response.data;代替$scope.info=response;