我正在使用angular 1.6.x

我有一个复选框列表,这些复选框使用变量(selectedJobIds)维护其状态。该变量包含选定的工作ID,例如,

$scope.selectedJobIds = {
 23: true,
 56: true,
 47: false
}


现在,我需要检查存在于该对象中且值为true的复选框。另外,即使对象中不存在复选框,也应选中该复选框。

目前,它无法区分不存在的id和具有假值的id。它取消选中它们两者。

尝试的方法:
1)我试图实现三元条件
ng-model="(angular.isDefined(selectedJobIds[job.iid])?selectedJobIds[job.iid]:true)"

但这会引发语法错误。

2)我尝试使用ng-model-options的getter / setter
但是问题是我无法将工作ID传递给getter函数。另外,我无法获取当前元素的范围,因此可以访问其值。因此,我可以使用此id来检测selectedJobIds变量中它的存在与否。

HTML:

<ul class="list-unstyled filtered-trucks-ul">
  <li ng-repeat="job in dType track by $index" style="vertical-align: middle;">
      <input type="checkbox" name="job_id" value="{{job.iid}}"
             ng-click="selectFilterJob()"
             ng-model="selectedJobIds[job.iid]" />
      <img src="23.png">
      {{ job.rref + ' (' +job.iid+ ')' | uppercase }}
      </li>
</ul>


JS:

$scope.checkedFilteredJobs = {
    getterFunc: function(newName) {
        console.log(newName)
        // if(angular.isDefined($scope.selectedJobIds[id]))
        // {
        //    return $scope.selectedJobIds[id];
        // }
        // else {
        return true;
        // }
    }
};

最佳答案

使用ng-init初始化缺少的属性:



var app = angular.module('myApp', []);

app.controller('myAppController', ['$scope', function($scope) {

  $scope.dType = [{iid: 23}, {iid: 56}, {iid: 47}, {iid: 1234}, {iid: 888}];
  $scope.selectedJobs = {
    23: true,
    56: true,
    47: false
  };

  $scope.initMissing = function(job) {
    if (!$scope.selectedJobs.hasOwnProperty(job.iid))
      $scope.selectedJobs[job.iid] = true
  }

}]);

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular.js"></script>
<div ng-app="myApp" ng-controller="myAppController">
  <ul>
    <li ng-repeat="job in dType track by $index">
      <input type="checkbox" ng-init="initMissing(job)" name="job_id"
             ng-model="selectedJobs[job.iid]" />
    </li>
  </ul>
</div>

10-02 21:02