清单模型和清单值未更新模型或未按预期运行

Question

下面是HTML

的内容

<label ng-repeat="(index, item) in field.optionValue">
          <input type="checkbox" 
          checklist-model="formControlsValues[dbColumnName]"  
          checklist-value="item">{{field.optionName[index]}}
        </label>

field.optionValue 和 field.optionName 是一个数组

field = { optionValue : ["1","2","3"], optionName : ["xxx", "yyy", "zzz"] }

checklist-model，formControlsValues[dbColumnName] 是一个动态对象模型，当复选框为 ticked/checked.
时，预计会填充值在渲染期间，控制器中的 formControlsValues[dbColumnName] 将是 $scope.formControlsValues.Village 或 $scope.formControlsValues.State 并且预计将填充为下面提到的格式 $scope.formControlsValues.Village = ["2","1"]

Answer 1

我做到了。它正在运行。

http://jsfiddle.net/fxsu6e79/1/

$scope.formControlsValues={
  State:[
     "1","3"
  ],
  Village:[
     "2","3"
  ]
};

可以吗？

Answer 2

<div ng-controller="DemoCtrl">
  <label ng-repeat="(index,value) in field.optionValue">
    <input type="checkbox" checklist-model="formControlsValues[field.dbColumnName]" checklist-value="value"> {{field.optionName[index]}}
  </label>
  values : {{ formControlsValues[dbColumnName]}}
</div>

脚本

angular.module("DemoApp", ["checklist-model"])
.controller('DemoCtrl', function($scope) {
  $scope.field = { 
      optionValue : ["1","2","3"], 
      optionName : ["xxx", "yyy", "zzz"], 
      dbColumnName : "State" 

  }
  $scope.dbColumnName="State";
  $scope.formControlsValues={
      State:[]
  };
});

参见示例：http://jsfiddle.net/KarthikParameswaran/fxsu6e79/4/

Answer 3

这是工作代码。我想指出你必须将数字作为数字而不是字符串（带双引号），因为你将来可能会导致问题。

// Code goes here

var app = angular.module('checkList', ["checklist-model"]);

app.controller('checkListCtrl', function ($scope) {
  $scope.formControlsValues = {};
  $scope.field = { 
      optionValue : ["1","2","3"], 
      optionName : ["xxx", "yyy", "zzz"],
      dbColumnName : "State"
  };
  
  $scope.dbColumns = ['State', 'Village'];
  $scope.formControlsValues = {
    Village : [],
    State : []
  }
});

<!DOCTYPE html>
<html ng-app="checkList">

  <head>
    <script data-require="angular.js@1.6.0" data-semver="1.6.0" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.0/angular.js"></script>
    <script data-require="checklist-model.js@*" data-semver="0.0.1" src="http://vitalets.github.io/checklist-model/checklist-model.js"></script>
    <link rel="stylesheet" href="style.css" />
    <script src="script.js"></script>
  </head>

  <body ng-controller="checkListCtrl">
      <h4>Checklist model</h4>
      <div>
        <label ng-repeat="(index, item) in field.optionValue">
            <input type="checkbox" 
            checklist-model="formControlsValues[field.dbColumnName]"  
            checklist-value="item">{{field.optionName[index]}}
        </label>
      </div>
      <br />
      <div>
        <select ng-model="field.dbColumnName" ng-options="d for d in dbColumns"></select>
      </div>
        <div>
          <label>Selected Villages: {{formControlsValues.Village}}</label>
        </div>
        <div>
         <label>Selected States: {{formControlsValues.State}}</label>
      </div>
  </body>

</html>

清单模型和清单值未更新模型或未按预期运行

checklist-model and checklist-value not updating model or not functioning as expected

javascript

checkboxlist

multi-select

angularjs