Javascript AngularJS：显示并更新ng重复的每个元素的进度条

我是AngularJS的初学者，我希望有人能帮助我编写这段代码，因为我不知道怎么做

情况是这样的：在我的项目中，我从服务器端（使用express的Node.js）接收到一个数组中的多个对象，并使用ng repeat显示信息。因此，假设每个对象都是一个扫描，每个扫描都有一个进度条。当您单击以运行该扫描时，将显示一个进度条以指示进度

我不知道要做的是为每个对象显示一个进度条，并更新每个进度条

也许我没有正确解释我想做什么，但我相信你会理解这个关于Plunker的例子：

我写道，我从服务器接收信息，因为我不能使用新字段来控制进度条。但我不想这样做

如您所见，如果单击按钮，将显示所有进度条。例如，对于id为“2”的对象，如何仅显示其进度条？例如，我如何更改文本“左25%”

提前感谢你的帮助

---

丹尼尔。

显示/隐藏栏

您可以添加一个额外的数组，该数组保存数据数组中相应项的“hide_bar”属性。这种方法的缺点是需要保持这些阵列同步

另一方面，为数据数组中的每个项添加另一个属性可能不是问题，除非您将数组发送回服务器，并且在保存或类似操作时无法正常忽略新属性。 如果直接从服务器接收数据，则属性“hide_bar”丢失/未定义，这是一个错误值。ng show将隐藏进度条。单击按钮并执行hide_bar=！隐藏栏将该值更改为true，并显示该栏

看一看:

最初，变量数组中的项没有属性“showProgress”

更改百分比

这取决于扫描进度数据的来源。我猜它来自服务器，是变量数组条目中的一个属性。然后更改progressbar很简单，就像

<span>{{ 100 - data.progress }}% left</span >

{{100-data.progress}}左%

---

同样，可以使用指令和小助手函数更改进度条div的样式，该函数将百分比值转换为类似{width:'75%}的对象。

我从您的plunkr中编了一些东西

---

您还应在答案中包含相关代码，以便在无法访问plnkr.com或该特定链接时，该答案对未来的访问者仍然有价值。