Angular 2/.NET Core 进度条 [英] Angular 2 / .NET Core Progress bar

问题描述

我正在进行这个项目，我从我的 Angular 2 站点 调用以在我的数据库中创建一些 Entity 条目.后端 API 大约需要 2 分钟才能完成作业，然后返回结果.

I have this project going on where I make a call from my Angular 2 site to create some Entity entries in my database. The backend API takes about 2 minutes to finish the job and then return the result.

目前我正在我的前端显示加载动画，以便用户知道某些事情仍在发生.但是由于需要时间，我想将其更改为进度条.

Currently I am displaying a loading animation on my frontend so the user knows that something is still going on. But because of the time needed I want to change this to a progress bar.

我知道我可以使用 Angular Material 来实现进度条，我可以用值更新它以显示进度.然而，我的问题如下:

I know I can use Angular Material to implement a progress bar and I can update it with values to show the progress. My question however is the following:

在调用后端 API 后，我如何向前端发送更新(类似于 counter++ 的事情)以更新进度条?

After making the call to the backend API, how do I send updates (sort of a counter++ thing) to my frontend to update the progress bar?

// PUT: api/admin/lorem
[HttpPut]
[Route("route")]
public async Task<IActionResult> CreateAndCalculateStuff([FromBody]Model model) {
    var lorem = await ipsum(model);
    return NoContent(); 
    // NoContent is currently a placeholder, I want to place my counter++ here
}

推荐答案

我最近看到了一个看起来有点错误的例子，但我想它确实有效.该示例使用了两个函数；一个启动初始功能，另一个请求该功能的状态.因此，在 CreateAndCalculateStuff() 中，您可以更新一个全局变量，然后在第二个中返回该全局变量.

I recently saw an example of this which looked a bit wrong but i guess it worked. The example used two functions; one to kick off the initial functionality and the other to request the status of that functionality. So in CreateAndCalculateStuff() you can update a global variable and in the second you return that global variable.

这篇关于Angular 2/.NET Core 进度条的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！