角没有看到JSON阵列中的所有对象

Question

所以我的代码

$scope.pauseChecked = function(monitorId, groupName) { 
    for (var i = 0; i < $scope.monitorResults.length; i++) { 
    if (document.getElementById('checkboxId').checked) { 
     adminService.pauseMonitor(monitorId, groupName).then(function(response) { 
     $scope.getMonitorResultsForSelectedGroups(); 
     $scope.filterResults(); 
     var keepGoing = true; 
     angular.forEach($scope.monitorResults, function(monitor) { 
      if (keepGoing) { 
      if (monitor.id == monitorId && groupName == monitor.groupName) { 
       monitor.triggerRunning = false; 
       keepGoing = false; 
      } 
      } 
     }); 
     }); 
    } 
    } 
}; 

这部分该行的所有的内部工作正常

<tr ng-repeat="result in monitorResults" ng-click="setSelected(result.id)" ng-class="{highlighted: result.id === selectedRow, selected: checkboxId}"> 

这条线外NG-重复

<td ng-show="monitorResults.triggerRunning"><button class="btn btn-info" style="width: 150px" ng-click="pauseChecked(monitorResults.id, monitorResults.groupName)">Pause Checked </button></td> 

并且这是怎么看它的页面

<table style="float:left; margin-left: auto; margin-right: auto;"> 
    <tr > 
     <td><button class="btn btn-primary" ng-click="runAllMonitorsNew()" style="width: 150px">Run All Monitors</button></td> 
     <td ng-show="!checkedGroup"><button class="btn btn-primary" style="width: 150px" ng-click="pauseGrMonitors(result.groupName)">Pause Monitors</button></td> 
     <td ng-show="checkedGroup"><button class="btn btn-primary" style="width: 150px" ng-click="resumeGrMonitors(result.groupName)">Resume Monitors</button></td> 
    </tr> 
     <tr> 
     <td><button ng-click="runChecked(result.id,result.groupName)" class="btn btn-info" style="width: 150px">Run Checked</button></td> 
     <td ng-show="monitorResults[0].triggerRunning"><button class="btn btn-info" style="width: 150px" ng-click="pauseChecked(monitorResults.id,monitorResults.groupName)">Pause Checked </button></td> 
     <td ng-show="!monitorResults[0].triggerRunning"><button class="btn btn-info" style="width: 150px" ng-click="resumeChecked(monitorResults.id,monitorResults.groupName)">Resume Checked</button></td> 
    </tr> 
</table> 
<table style="float: right; margin-right: 50px"> 
    <tr> 
     <td> 
      <json-editor-input model="monitorResults" configuration="configuration" on-error="onError(err)"/> 
     </td> 
    </tr> 
</table> 
</div> 
<BR> 
     <img class="center-block" src="ajax-loader.gif" ng-show="loading"/> 
<BR> 
<table class="table table-striped table-bordered"> 
    <tr> 
     <td><B>Monitor Id</B></td> 
     <td><B>Monitor Name</B></td> 
     <td><B>Monitor Type</B></td> 
     <td><B>Group Type</B></td> 
     <td><B>Warn Threshold</B></td> 
     <td><B>Error Threshold</B></td> 
     <td><B>Monitor Result</B></td> 
     <td><B>Compare Result</B></td> 
     <td><B>Last Run Date</B></td> 

    </tr> 
     <tr ng-repeat="result in monitorResults" ng-click="setSelected(result.id)" ng-class="{highlighted: result.id === selectedRow, selected: checkboxId}"> 
     <td><input type="checkbox" ng-model="checkboxId" id="checkboxId" name="checkboxId"></td> 
     <td>{{result.id}}</td> 
     <td>{{result.name}}</td> 
     <td>{{result.type}}</td> 
     <td>{{result.groupName}}</td> 
     <td>{{result.warnThreshold}}</td> 
     <td>{{result.errorThreshold}}</td> 
     <td>{{result.monitorResult}}</td> 
     <td> <p ng-style="changeColor(result.compareResult)">{{result.compareResult}}</p> </td> 
     <td>{{result.lastRunTime}}</td> 
     <td> <button class="btn btn-primary" ng-click="runMonitorNew(result.id,result.groupName)">Run</button> </td> 
     <td ng-show="result.triggerRunning"><button class="btn btn-primary" ng-click="pause(result.id,result.groupName)">Pause</button> </td> 
     <td ng-show="!result.triggerRunning"><button class="btn btn-primary" ng-click="resume(result.id,result.groupName)">Resume</button> </td> 
    </tr> 

这是我在调试器

你能看的见，我已经取代了“结果”的“monitorResults”，因为它给了我访问数组，但事情是当我通过调试器检查代码时，我发现monitorId和groupname是未定义的。因此，我已经使用monitorResults [0] .id和monitorResults [0] .groupName，但它给了我只访问数组中的第一个元素，如何获得每个元素的访问？

Answer 1

解释你的函数：

$scope.pauseChecked = function(monitorId, groupName) { //you might be getting monitorId and group name properly 
    for (var i = 0; i < $scope.monitorResults.length; i++) { //maybe you are looping to get all selected elements 
    if (document.getElementById('checkboxId').checked) { //this will never work properly, because it will only find the first element(due to id which may/maynot be checked), plus why are you trying to do this? 
     adminService.pauseMonitor(monitorId, groupName).then(function(response) { 
     $scope.getMonitorResultsForSelectedGroups(); 
     $scope.filterResults(); 
     var keepGoing = true; 
     angular.forEach($scope.monitorResults, function(monitor) { 
      if (keepGoing) { 
      if (monitor.id == monitorId && groupName == monitor.groupName) { 
       monitor.triggerRunning = false; 
       keepGoing = false; 
      } 
      } 
     }); 
     }); 
    } 
    } 
}; 

Answer 2

由于您有两个表已分离，所以在检查结果时需要在范围中设置一个模型，并且该模型是您应该在暂停按钮中引用的模型。实际上，所有监视器，运行和暂停方法都不需要在方法中传递变量，这些方法应该在内部引用范围变量checkboxId。这是框的检查，应该设置结果为true，以供其他方法使用。

有意义吗？

编辑

我也会改变checkboxId到result.checked并设置真或假。然后，其他操作的控制器方法应循环遍历结果列表，并查找检查的结果并使用它。

模式

使用了两个分离的表等，这是在为类似“器isChecked”，“isPaused得到”所需的操作上的阵列中的模型中的底部的属性集为具有表2中的图案，管他呢。

表1然后具有调用控制器方法的按钮。这些方法遍历数组并检查切换属性的状态（isChecked，isPaused或其他）。然后这些方法通过调用另一种方法并传入满足条件的模型来执行所需操作。

视图表是彼此不可知的，所有识别模型的工作都发生在控制器中。视图所做的唯一事情就是更新数组项目的属性。