Javascript 在ng repeat angular spin.js中加载多个项目的微调器

普朗克：

我在我的ng repeat中有一个项目列表

单击/选择其中一个项目时，它们将从左栏中删除并添加到右栏中。当它们放置在右侧列中时，应显示一个微调器

我无法让它像在plunker中本地构建时那样工作，但我的具体问题是，微调器只有在单击列表中的第一项时才会启动

它在plunker中的行为类似，如果先单击第二项，然后单击第二项，微调器将显示。但是，每次将每个项目移动到右侧列时，我都需要一个微调器来显示它

它必须与下面的userState-{{$index}}和'userState-'+user.id有关

<li class="pull-right">
   <div dw-loading="userState-{{$index}}" 
        dw-loading-options="{overlay: true, text: '', 
           spinnerOptions: {length: 6, width:3, radius: 6}}">
       <a href="" ng-click="remove(sUser)">
          <i class="glyphicons remove inline"></i></a>
    </div>
 </li>




$scope.loadUsers = function(user) {
       $loading.start('userState-'+suspect.id);
   $timeout( function() {
           $loading.finish('userState-'+user.id);
       }, 3000)

     };

---

谢谢

我查看了这个问题，还查看了您用于加载的指令。从我的快速概述来看，该指令似乎是在ng repeat周围使用的，而不是在已重复的每个元素上使用的

我在这里更新了您的plunk，其工作方式如下：

我将加载指令移到ng repeat之外，如下所示：

<div dw-loading="sSuspectLoading" dw-loading-options="{overlay: true, text: '', spinnerOptions: {length: 6, width:3, radius: 6}}" class="">
    <div ng-repeat="sSuspect in selectedSuspects" class="top-buffer">
        <!-- Repeated content here -->
    </div>
</div>

如果你想在每个单独的项目上加载，而不是整个ng重复，我认为你使用这个指令的方式是错误的，因为从我的快速观察来看，它看起来不像是为这个设计的

$loading.start('sSuspectLoading');
$timeout( function() {
    $loading.finish('sSuspectLoading');
}, 3000);