ng-model 值未传递给控制器函数
ng-model value not passed to the controller function
我正在使用 ng-model 将表单值传递给控制器函数。但它没有传递正确的复选框值。这是我的笨蛋。请帮我解决这个问题。
https://plnkr.co/edit/3gOuQwzt3SMNbAXplq0x?p=preview
我的模板是:
<div class="tab-pane fade " ng-repeat="(key, value) in all_user_wl_data" id="{{key}}" ng-class='{"in active":$first}'>
<div class="form-group">
<div class="row">
<div class="col-sm-6 col-md-6 col-lg-6" ng-repeat="(key1, value1) in value.wl_dict">
<div class="checkbox checkbox-success">
<input id="{{key1}}" type="checkbox" name="valueis" class="form-control" ng-model="formData[key1]">
<label for="{{key1}}">
{{value1}}
</label>
</div>
</div>
</div>
</div>
<div class="form-group">
<div class="row"><div class="col-lg-3 col-md-3 col-sm-3"> <label class="control-label">Group Name </label></div>
<div class="col-md-6 col-sm-6 col-lg-6"> <input type="text" name="regular" class="form-control" ng-model="formData.key2"></div></div><br>
<button type="button" class="btn btn-success" data-original-title="" title="" ng-click="createGroup(formData)">Save changes</button>
</div>
这里当我打印 console.log(formData) 时,它只打印文本框的值而不打印复选框的值。
您没有为复选框 ng-model“formData
”启动 $scope ..
因此,如果您像这样将模型启动到控制器中,$scope.formData = []
它将像这样在您的 formData
中附加真实值,
[2221: true, 8233: true]
试试这个。在控制器中定义 $scope.formData = [];
如大家所言。
在控制器
中设置$scope.formData
工作计划
使用
$scope.formData = {}
在你的控制器中
我将你的脚本更改为以下并且有效
angular.module('formExample', []) .controller('ExampleController', ['$scope', '$http', function($scope, $http) {
$scope.formData = {};
$http.get('test.json')
.success(function(data) {
$scope.all_user_wl_data = data;
angular.forEach(data, function(areadata) {
$scope.usersubscribedwl = data;
console.log(data);
})
})
$scope.createGroup = function() {
console.log($scope.formData);
}
}
试试这个
<input id="{{key1}}" type="checkbox" name="valueis" class="form-control" ng-model="formData.key1[value1]">
并在控制器中
$scope.formData=[];
我正在使用 ng-model 将表单值传递给控制器函数。但它没有传递正确的复选框值。这是我的笨蛋。请帮我解决这个问题。
https://plnkr.co/edit/3gOuQwzt3SMNbAXplq0x?p=preview
我的模板是:
<div class="tab-pane fade " ng-repeat="(key, value) in all_user_wl_data" id="{{key}}" ng-class='{"in active":$first}'>
<div class="form-group">
<div class="row">
<div class="col-sm-6 col-md-6 col-lg-6" ng-repeat="(key1, value1) in value.wl_dict">
<div class="checkbox checkbox-success">
<input id="{{key1}}" type="checkbox" name="valueis" class="form-control" ng-model="formData[key1]">
<label for="{{key1}}">
{{value1}}
</label>
</div>
</div>
</div>
</div>
<div class="form-group">
<div class="row"><div class="col-lg-3 col-md-3 col-sm-3"> <label class="control-label">Group Name </label></div>
<div class="col-md-6 col-sm-6 col-lg-6"> <input type="text" name="regular" class="form-control" ng-model="formData.key2"></div></div><br>
<button type="button" class="btn btn-success" data-original-title="" title="" ng-click="createGroup(formData)">Save changes</button>
</div>
这里当我打印 console.log(formData) 时,它只打印文本框的值而不打印复选框的值。
您没有为复选框 ng-model“formData
”启动 $scope ..
因此,如果您像这样将模型启动到控制器中,$scope.formData = []
它将像这样在您的 formData
中附加真实值,
[2221: true, 8233: true]
试试这个。在控制器中定义 $scope.formData = [];
如大家所言。 在控制器
中设置$scope.formData工作计划
使用
$scope.formData = {}
在你的控制器中
我将你的脚本更改为以下并且有效
angular.module('formExample', []) .controller('ExampleController', ['$scope', '$http', function($scope, $http) {
$scope.formData = {};
$http.get('test.json')
.success(function(data) {
$scope.all_user_wl_data = data;
angular.forEach(data, function(areadata) {
$scope.usersubscribedwl = data;
console.log(data);
})
})
$scope.createGroup = function() {
console.log($scope.formData);
}
}
试试这个
<input id="{{key1}}" type="checkbox" name="valueis" class="form-control" ng-model="formData.key1[value1]">
并在控制器中
$scope.formData=[];