在 angularjs 中添加延迟

Question

我想在angularjs中添加一些延迟。以便它可以从 API 获取数据。因为我的 api 很重。我正在调用此函数。基本上，我想要一些延迟来加载页面，以便我的api正常工作。我尝试了一些时间我的数据立即提取，有时我遇到错误。当我刷新页面时，它工作正常。

Help to put $timeout function in this angularjs
// Geting test stuff
$scope.teststuff = function () {
$scope.loading = true;
$http.get(settings.WebApiBaseUrl + 'Api/testing')           
.success(function (data) {
$scope.mydata = data;
$scope.loading = false;
}).error(function (data, status, headers, config) {
alert("Error " + status )             
$scope.loading = false;
})      

}

Answer 1

更新：

这个问题可以通过使用resolve property of $routerProvider轻松解决。请使用此配置。因此，这里的路由/ed在解析完成之前不会加载，这意味着 http 请求必须返回一个值，只有在该值之后才会加载页面。

app.config(['$routeProvider', '$httpProvider', function ($routeProvider, $httpProvider) {
var settings.WebApiBaseUrl =  "some url you want to use";
$routeProvider.when("/al", { templateUrl: "Views/test.html", controller: "testCtrl" })
.when("/ed", { 
templateUrl: "Views/test2.html", 
controller: "test2Ctrl",
resolve: {
initialize: function($http, $sessionStorage){
$http.get('api/ApiKey/' + $sessionStorage.user)
.success(function (myKey) { 
return $http.get(settings.WebApiBaseUrl + 'Api/test1', { headers: { 'X-ApiKey': myKey } })
.success(function (data) { 
return data; 
}).error(function (data, status, headers, config) { 
alert("error" + status);
});
}).error(function (data, status, headers, config) { 
alert("error" + status);
}); 
}
}
})
.otherwise({ 
redirectTo: '/al' 
}); 
}]);

现在在控制器中您需要执行。

app.controller( 'test2Ctrl', function ( $scope, initialize ) {
$scope.loading=false;
$scope.test1=initialize;
$scope.loading=true;
});

旧答案：所以你有一个 http 请求，这是一个承诺，会等到收到数据，从你的例子中我可以看到你正在实现加载屏幕之类的东西，直到 http 请求完成。

为了确保庞大的 http 请求不会超时，您可以使用。

angular.module('MyApp', [])
.config(['$httpProvider', function($httpProvider) {
$httpProvider.defaults.timeout = 5000;
}]);

当页面等待 http 请求完成时，您可以使用 scope 变量 ($scope.loading = true;( 激活加载微调器库来屏蔽您的页面。签出角度加载覆盖或其他一些代码来执行此操作。

参考： HTTP 超时