Question

我必须为我的代码使用单一复选框

我的doc.ejs

<tr ng-repeat="folder_l in folderlist | orderBy:created_date" >
   <td>
      <div class="permit">
         <input class="chkbtn move_check" type="checkbox" id="movecheck{{folder_l._id}}" name="movecheck" value="{{folder_l._id}}" ng-model="checkfolder" ng-click="updateSelection($index, folderlist)" />
         <label class="chklabel" for="movecheck{{folder_l._id}}"></label>{{checkfolder}}
      </div>
   </td>
</tr>

app.js：

$scope.updateSelection = function(position, entities) {
  angular.forEach(entities, function(subscription, index) {
         console.log('position')

     console.log(parseInt(position))
         console.log('index')

    console.log(parseInt(index))

          $scope.checkfolder;

        if (parseInt(position) == parseInt(index)) {
      console.log("Equal")
     $scope.checkfolder = true;
    }
    else{
      $scope.checkfolder = false;
    }
  });
}

我搜索了很多链接而且我已经尝试了，但是我的代码没有任何效果，即使我已经尝试了jquery点击，但点击功能还没有被调用。

更新我的JSON

{
    "_id" : *****,
    "__v" : 0,
    "folder_name" : "Music",
    "status" : "Y",
    "created_date" : ISODate("2017-12-29T10:50:31.171Z"),
    "updated_date" : ISODate("2017-12-29T10:50:31.171Z")
}

Answer 1

HTML：

<tr ng-repeat="folder_l in folderlist | orderBy:created_date" >
   <td>
      <div class="permit">
         <input class="chkbtn move_check" type="checkbox" id="movecheck{{folder_l._id}}" name="movecheck" value="{{folder_l._id}}" ng-model="folder_l.checkfolder" ng-click="updateSelection($index, folderlist)" ng-checked="{{folder_l.checkfolder}}" />
         <label class="chklabel" for="movecheck{{folder_l._id}}"></label>{{folder_l.checkfolder}}
      </div>
   </td>
</tr>

JS

$scope.updateSelection = function(position, entities) {
    angular.forEach(entities, function(subscription, index) {
        if (parseInt(position) == parseInt(index)) {
          subscription.checkfolder = true;
        } else {
            subscription.checkfolder = false;
        }
    });
}

Answer 2

为此您需要创建虚拟模型。如果你看到我创建了 isSelected

<tr ng-repeat="folder_l in folderlist | orderBy:created_date" >
   <td>
     <div class="permit">
     <input class="chkbtn move_check" type="checkbox" 
       id="movecheck{{folder_l._id}}" name="movecheck" value="
         {{folder_l._id}}" ng-model="folder_l.isSelected"/>
     <label class="chklabel" for="movecheck{{folder_l._id}}"></label>
     {{folder_l.isSelected}}
      </div>
   </td>
</tr>

只做这个，你一次只能选择一个复选框。并且对于提交，您可以遍历阵列。

angular.forEach(entities, function(subscription, index) {
       if(subscription.isSelected)
         console.log('position')
})

角度js的单个复选框

2 个答案: