Question

我想通过http请求在我的组件中设置数据，但$ http.get数据之外是未定义的。

如何获取$ http.get以外的响应数据？

'use strict';
 angular.
 module('filesApp').
 component('filesList', {
  template:
      '<ul>' +
        '<li ng-repeat="file in $ctrl.files">' +
          '<span>{{file.data1}}</span>' +
          '<p><a href="{{file.data2}}">Create</a></p>' +               
        '</li>' +
      '</ul>',      
  controller: function FilesListController($http, $scope) {
      //need response.data here
              $http.get('/api/1').then(function (response) {
              if (response.data.error) {
                  return null;
              } else {                      
                  $http.get('/api/2' + response.data).then(function (response) {
                      if (response.data.error) {
                          return null;
                      } else {                              
                          //response.data contains data that I need.                              
                          return response.data;
                      }
                  });
              }
          });          
  }
});

Answer 1

您需要在范围上存储response.data，以便在视图中使用它。

'use strict';
 angular.module('filesApp')
    .component('filesList', {
        template:
            '<ul>' +
                '<li ng-repeat="file in $ctrl.files">' +
                    '<span>{{file.data1}}</span>' +
                    '<p><a href="{{file.data2}}">Create</a></p>' +               
                '</li>' +
            '</ul>',      
        controller: function FilesListController($http, $scope) {
              $http.get('/api/1').then(function (firstResponse) {
                  if (firstResponse.data.error) {
                      return null;
                  } else {                      
                      $http.get('/api/2' + firstResponse.data).then(function (secondResponse) {
                          if (secondResponse.data.error) {
                              return null;
                          } else {
                              $scope.files = secondResponse.data;
                          }
                  });
              }
          });          
      }
});

Answer 2

有很多方法可以做到这一点。当然最简单的方法是将响应数据存储在范围内的变量中。 E.g。

controller: function FilesListController($http, $scope) {
   //need response.data here
   $http.get('/api/1').then(function (response) {
      if (response.data.error) {
          return null;
      } else {                      
          $http.get('/api/2' + response.data).then(function (response) {
              if (response.data.error) {
                  return null;
              } else {                              
                  //response.data contains data that I need.  
                  $scope.dataYouNeed = response.data;                            
              }
          });
      }
  });

}

您可以使用{{dataYouNeed}}在视图中的某个位置显示它。

如何获取AngularJS中的response.data值？

2 个答案: