javascript - 使用 ng-repeat 时如何获取复选框的值？

Question

文件view.html中的代码:

<label ng-repeat = "agents in acesslevel |filter:{acesslevel: 'Agent'}">
    <div class="col-xs-2">
        <input type= "checkbox"
               ng-model="agentsSelected"
               checklist-value="agents.name"
               ng-true-value=agents ng-false-value="'NO'">
        {{agents.name}}
    </div>
</label>

其中 accesslevel 是我从数据库获取的 JSON 格式数据。

例如，

{
  "acesslevel": "Quality",
  "dob": "1995-02-03",
  "name": "anjali",
  "password": "tanya",
  "username": "anju",
  "createdAt": "2014-07-02T16:26:26.816Z",
  "updatedAt": "2014-07-02T16:26:26.816Z",
  "id": "53b432b230aaa394278522ca"
},

{
  "acesslevel": "Agent",
  "dob": "1995-02-03",
  "name": "christopher",
  "password": "tanya",
  "username": "anju",
  "createdAt": "2014-07-02T16:26:48.170Z",
  "updatedAt": "2014-07-02T16:26:48.170Z",
  "id": "53b432c830aaa394278522cb"
}

HTML 中的这个特定代码正在显示 accesslevel 中代理的名称(在上面的情况下它将显示 christopher)

如何获取 Controller 中所选复选框的值？

我想将此选定代理的数据插入到我的数据库服务器的新表中。

Answer 1

问题是您使用的 ng-model 绑定(bind)到(我认为是)一个数组，但 Angular 需要一个 bool 值(true 或 false)。

如果您改为绑定(bind)到已过滤的访问级别数组的实例的属性，您可以稍后在 Controller 中提取该数据

<label ng-repeat = "agents in acesslevel |filter:{acesslevel: 'Agent'}">
    <div class="col-xs-2">
        <input type= "checkbox"
               ng-model="agents.isSelected" <!-- bind to another value -->
               checklist-value="agents.name"
               ng-true-value="agents"
               ng-false-value="'NO'">
        {{agents.name}}
    </div>
</label>

如果您有一个向后端提交值的方法，您的 Controller 稍后可以访问此属性。

$scope.submit = function() {
    var selectedAgents = [];
    angular.forEach($scope.acesslevel, function (agent) {
        if (agent.acesslevel == 'Agent' && agent.isSelected) {
            selectedAgents.push(agent);
        }
    });
    // Here you can make calls to your backend with the selectedAgents variable.

};