Javascript $http get请求在angularjs/ionic中未及时完成

我试图用值来填充选项，而不是用未定义的值，但似乎在选择框完成加载后继续获取值

HTML:

AngularJS控制器：

  .controller('MainCtrl', ['$scope', '$http', '_', 'DataFactory', function ($scope, $http, _, DataFactory) {

$scope.fromSelected = "";
$scope.toSelected = "";

DataFactory.getAllStops().then(function successCallback(res) {
  console.log(res);
  $scope.stops = res.data;

}, function errorCallback(err) {
  console.log("error: ");
  console.log(err);
});

$scope.changed = function (location, destination) {
console.log($scope.stops);
  $scope.possibleRoutes = DataFactory.getPossibleRoutes(location, destination);

---

考虑使用占位符数据初始化

$scope.stops

（即

$scope.stops=[{stop\u id:false，name:'Loading'}]

）

或者，在数据加载完成后，可以使用ng if加载选择框

前

---

另一个选项是在$scope.stops未定义的情况下显示加载状态时执行上述操作。这与上面的操作类似。

考虑使用占位符数据初始化

$scope.stops

（即

$scope.stops=[{stop\u id:false，name:'loading'}]

或者，在数据加载完成后，可以使用ng if加载选择框

前

---

另一个选项是，在未定义$scope.stops的情况下，在显示加载状态时执行上述操作。这与上述操作类似。

您的工厂未按预期返回工厂中的承诺。请按如下所示从工厂中删除“然后”以返回承诺或http请求：

 .factory('DataFactory', ['$http', function ($http) {


// Might use a resource here that returns a JSON array
return {

  getAllStops: function () {
    return $http({
      method: 'GET',
      url: 'https://myAPIURL.com/api',
      headers: {
        "Accept": "application/json",
        "X-Mashape-Key": "KEYKEYKEYKEYKEYKEYKEYKEYKEYKEYKEY"
      }
    })
  },
      getAllRoutes: function () {
      return someresult similar to the above function;
  // more functions. 
  }

假设您得到响应，那么一旦做出更改，控制器就会正确地处理承诺

---

此外，请验证“stop\u id”是否在实际响应中。与…stopID或其他内容相反。如果stopID在那里，但您正在拉stop.stop\u id，则它将显示为未定义。

您的工厂没有按预期返回工厂中的承诺。请按如下所示从工厂中删除“then”以返回承诺或http请求：

 .factory('DataFactory', ['$http', function ($http) {


// Might use a resource here that returns a JSON array
return {

  getAllStops: function () {
    return $http({
      method: 'GET',
      url: 'https://myAPIURL.com/api',
      headers: {
        "Accept": "application/json",
        "X-Mashape-Key": "KEYKEYKEYKEYKEYKEYKEYKEYKEYKEYKEY"
      }
    })
  },
      getAllRoutes: function () {
      return someresult similar to the above function;
  // more functions. 
  }

假设您得到响应，那么一旦做出更改，控制器就会正确地处理承诺

另外，验证“stop\u id”是否在实际响应中。与…stopID或其他内容相反。如果stopID在那里，但您正在拉动stop.stop\u id，它将显示为未定义。

“此外，验证“stop\u id”“在实际响应上。与…stopID或其他内容相反。如果stopID在那里，但您正在拉stop.stop_id，则它将显示为未定义。“关闭。它增加了一个额外的深度，这很奇怪。我必须执行res.data.data以获得所需内容。”此外，请验证“stop_id”在实际响应上。与…stopID或其他东西相反。如果stopID在那里，但您正在拉stop.stop_id，它将显示为未定义。“关闭。它增加了一个额外的深度，这很奇怪。我必须执行res.data.data以获得我需要的内容。

<div class="input" ng-if="stops"> 
  <label for="to">Destination:
    <select id="to" name="to" ng-model="toSelected" data-ng-options="stop.stop_id as stop.name for stop in stops">
       <option value="">Choose a Destination</option>
    </select>
  </label>
</div>

DataFactory.getAllStops().then(function successCallback(res) {
  console.log(res);
  $scope.stops = res.data;
}, function errorCallback(err) {
  console.log("error: ");
  console.log(err);
  // TODO: Gracefully degrade
});

 .factory('DataFactory', ['$http', function ($http) {


// Might use a resource here that returns a JSON array
return {

  getAllStops: function () {
    return $http({
      method: 'GET',
      url: 'https://myAPIURL.com/api',
      headers: {
        "Accept": "application/json",
        "X-Mashape-Key": "KEYKEYKEYKEYKEYKEYKEYKEYKEYKEYKEY"
      }
    })
  },
      getAllRoutes: function () {
      return someresult similar to the above function;
  // more functions. 
  }