Question

希望将HTTP请求中的返回对象转换为另一个范围对象，以便我可以在带有ng-repeat指令的HTML中使用它。如何将返回的对象变为变量？

调用HTTP函数
获取数据
商店回复
使范围变量成为HTTP响应的值

JS：

angular.module('myApp').controller('ItemController',[
  '$scope', '$http', '$location',
  function($scope, $http, $location){

  var currentLocation = $location.path();

   $scope.getItem = function(){
      $http.get('path/to/json/file.json').then(
        function(response){
          $scope.results = response.data;
          console.log('item controller, item:', $scope.results);
        });

    };

    $scope.item = //MAKE THIS VALUE OF THE RETURN OBJECT FROM getItem
      console.log('scope.item', $scope.item);
    }
]);

JSON

[
  {
    "first_name": "Mega",
    "last_name": "Man",
    "image": "http://placehold.it/75x75"
  }
]

HTML

希望能够拥有

<p>{{item.first_name}}</p>
<p>{{item.last_name}}</p>
<img ng-src="{{item.image}}"/>

更新了JS通话

$scope.getItem = function(){
    $http.get('path/to/json/file.json')
    .success(function(data){
      $scope.results=data;
      console.log('$scope.results: ',$scope.results);
    }).error(function(data){
      console.log(data);
    }).then(
      function(){
        $scope.item = $scope.results;
        console.log('$scope.item: ', $scope.results);
      });
  };

Answer 1

您可以通过不同方式执行此操作，一种方法是使用success和error 回调等功能：

 $http.get('path/to/json/file.json')
                .success(function (data, status, header, config) {
                  $scope.results =data;
          console.log('item controller, item:', $scope.results);
                })
                .error(function (data, status, header, config) {
                  console.log(data);
                });

另一种选择是使用then 承诺功能，如：

 $http({method: 'GET', url: 'path/to/json/file.json').
        then(function(response) {
           $scope.results = response.data;
           console.log('item controller, item:', $scope.results);
        }, function(response) {
          console.log(response);
      });

Answer 2

正在发生的问题是让回调正常工作。将.then()方法替换为.success()和.error()。由于被调用的对象是一个数组，因此无法在HTML中解析它以获取对象属性。需要的另一部分是成功回调，以$scope.results=data[0]

获取数组的第一个对象

$scope.getItem = function(){
  $http.get('path/to/json/file.json')
  .success(function(data){
    $scope.results=data[0];
    console.log('$scope.results: ',$scope.results);
  }).error(function(data){
    console.log(data);
  });
};

将Angular $ http返回值转换为另一个对象

2 个答案: