将 ng-repeat 与引导程序的进度条一起使用答案

【问题标题】：using ng-repeat with bootstrap's progress bar将 ng-repeat 与引导程序的进度条一起使用
【发布时间】：2016-03-10 21:28:18
【问题描述】：

我正在尝试使用 ng-repeat 创建此进度条 (https://plnkr.co/edit/LKt0PmMjPjBzY34JTsRR?p=preview)：

<div class="progress" style="transform: rotate(-90deg); width: 494px">
 <div ng-repeat="o in arr">
  <div class="progress-bar progress-bar-success" role="progressbar" style="width:5px;"></div>
  <div class="progress-bar" role="progressbar" style="width:1px; background:transparent;"></div>
 </div>
</div>

但是，它不起作用，因为 Bootstrap 不接受我用于 ng-repeat 的额外 div。关于如何解决这个问题的任何想法？

这是一个现场 Plunker：http://plnkr.co/edit/q9QW2Pn08uYrHllHb9oa?p=preview

【问题讨论】：

标签： javascript css angularjs twitter-bootstrap

【解决方案1】：

只需重复 green 元素本身：

<div ng-app="app">
  <div ng-controller="ctrl">
    <div class="progress" style="transform: rotate(-90deg); width: 494px">
      <green ng-repeat="o in arr"></green>
    </div>
  </div>
</div>

演示： http://plnkr.co/edit/f1Tqfu5O9GsJiy4Nt7tk?p=preview

【讨论】：