2017-01-27 16 views
0

Ниже содержание 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 является массивом

поле = {OptionValue: [ "1", "2", "3"], Optionname: [ "ххх", "YYY", "ZZZ"]}

checklist-model, formControlsValues ​​[dbColumnName] - динамическая объектная модель, которая, как ожидается, заполняет значения, когда галочка отмечена/отмечена.
Во время рендеринга formControlsValues ​​[dbColumnName] будет $ scope.formControlsValues.Village или $ scope.formControlsValues.State в контроллере, и, как ожидается, будет заполнить ниже упоминается формат $ scope.formControlsValues.Village = ["2", "1"]

+0

Может кто-нибудь, пожалуйста, помогите мне с работой здесь? – teenu

ответ

1

Я сделал это. и он работает.

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

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

это нормально?

+0

Привет @fingerpich. Сначала я хочу поблагодарить вас за то, что вы поработали над этим. Объект должен быть $ scope.field = { OptionValue: [ "1", "2", "3"], Optionname: [ "ххх", "YYY", "ZZZ"], dbColumnName: " State " } В чем я могу отслеживать значения $ scope.field.State – teenu

+0

Также мне нужно добавить« контрольный список-модель »- это инжектор? – teenu

+0

Я исправил его. http://jsfiddle.net/fxsu6e79/3/ – fingerpich

1
<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> 

Script

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/

1

Вот рабочий код. Я хотел бы указать, что вам нужно получать числа в виде чисел вместо строк (с двойными кавычками), поскольку в будущем вы можете столкнуться с проблемами.

// 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="[email protected]" data-semver="1.6.0" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.0/angular.js"></script> 
 
    <script data-require="[email protected]*" 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>