异步函数返回未定义,$q延迟

Asynchronously function returns undefined with $q deferred

本文关键字:延迟 未定义 函数 返回 异步      更新时间:2023-09-26

我通过如下所示的工厂从我的 api 调用我的数据:

app.factory('Service', ['$http', function ($http) {
var urlBase = 'http://localhost:50476/api';
var Service = {};
Service.getComp = function () {
    return $http.get(urlBase + '/complaints')
};
return Service;
}]);

然后我使用我的控制器来使用指令:

getComp();
$scope.comp = [];
function getComp() {
    var deferred = $q.defer();
    Service.getComp()
    .success(function (comp) {
        console.log('comp', comp); //returns array data
        $scope.comp = comp.data;
        deferred.resolve(comp);
    })
    .error(function (error) {
        $scope.error = 'error' + error.message;
    });
    return deferred.promise;
}
$scope.index = 0;
$scope.complaints = $scope.comp[0];
console.log($scope.complaints); //undefined
console.log($scope.comp); //array of 0

当我尝试访问函数之外的项目时,它是未定义的。我试图寻找像使用$q这样的分辨率,但它仍然没有显示数据。当我添加延迟部分时,我的 ng 重复也停止工作。

试试这个:

getComp();
$scope.comp = [];
function getComp() {
    return Service.getComp()
    .success(function (comp) {
        $scope.comp = comp.data;
        $scope.complaints = $scope.comp[0];
    })
    .error(function (error) {
        $scope.error = 'error' + error.message;
    });
}

执行日志时未定义这些值,因为这些行在请求从服务器返回之前运行。这就是为什么设置$scope.complaints必须进入success回调的原因。

如果你想确保在开始逻辑之前complaints加载到某些状态,你可以使用 UI-routers resolve关键字(我想你正在使用带有 ionic - 标准包的 UI-路由器)

在你主要.js

$stateProvider.state('yourState', {
  resolve: {
    complaints: function(Service) {
      return Service.getComp();
    }
  }
});

然后,您可以在控制器中注入complaints

.controller('myController', function(complaints) {
   $scope.complaints = complaints;
})

resolve$stateProvider将阻止并等待承诺解决...