gpt4 book ai didi

javascript - 带有 $http 请求的 Angular js 中的加载时间百分比

转载 作者:数据小太阳 更新时间:2023-10-29 08:11:11 28 4
gpt4 key购买 nike

我在 Rails 应用程序中使用 Angular

我有一个演示应用程序。我需要显示以 Angular 加载响应所需的响应时间

举个例子。

我正在加载 100 k 元素数组的响应。我想显示百分比从 0% 开始并随着响应负载增加。加载完整响应后,它会完成响应时间 100%

使用文件的详细信息

/app/views/layouts/application.html.erb

<!DOCTYPE html>
<html>
<head>
<title>Anguler</title>
<%= stylesheet_link_tag 'application', media: 'all', 'data-turbolinks-track' => true %>
<%= javascript_include_tag 'application', 'data-turbolinks-track' => true %>
<%= csrf_meta_tags %>
</head>
<body>
<%= yield %>
</body>
</html>

/app/views/pages/index.html.erb

<div ng-app="myApp" ng-controller="customersCtrl">
<ul>
<li ng-repeat="x in myData">
{{ x }}
</li>
</ul>
</div>

/app/controllers/pages_controller.rb

class PagesController < ApplicationController
def index
@arr = []
for n in 1..100000
@arr.push(n)
end
return render json: @arr
end
end

/app/controllers/application_controller.rb

class ApplicationController < ActionController::Base
# Prevent CSRF attacks by raising an exception.
# For APIs, you may want to use :null_session instead.
protect_from_forgery with: :exception
end

/assets/javascripts/application.js

//= require jquery
//= require jquery_ujs
//= require turbolinks
//= require angular.min
//= require custom.min

/assets/javascripts/custom.js

var app = angular.module('myApp');
app.controller('customersCtrl', function($scope, $http) {
$http.get("/").then(function (response) {
$scope.myData = response.data.records;
}
});

让我知道如何以百分比显示加载百分比时间

非常感谢

最佳答案

angular-loading-bar是一个很好的插件来帮助你实现它。

关于javascript - 带有 $http 请求的 Angular js 中的加载时间百分比,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/42945777/

28 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com