Angularjs 复选框选中的值未识别
Angularjs check box selected values not identified
嗨,这个问题已经问过了,但没有解决我的问题。
我正在将复选框值传递给控制器,但我无法确定选择了哪个。
这是我的代码
HTML:
<div class="col-sm-3" ng-repeat="days in formData.businessDays">
<input type="checkbox" ng-model="business_days.Selected" ng-change=""><span> {{days.name}}</span>
</div>
Js:
$scope.addData = function(form)
{
$scope.formData.days_id = [];
angular.forEach($scope.formData.businessDays, function(businessDays){
//console.log(businessDays);
if (businessDays.Selected) {
$scope.formData.days_id.push(businessDays.value);
}
})
}
//this days data values
$scope.formData.businessDays = [{
name: "Monday",
value: "M",
}, {
name: "Tuesday",
value: "T",
}, {
name: "Wednesday",
value: "W",
}, {
name: "Thursday",
value: "Th",
}, {
name: "Friday",
value: "F",
}, {
name: "Saturday",
value: "S",
}, {
name: "Sunday",
value: "Su",
}, ];
这是我的控制台图像
I can't identify which on is selected values ?
您必须为 $scope.formData.businessDays
中的每个 object
提供一个 属性 selected
以识别它是否被选中,例如 :-
$scope.selectedItems = [];
$scope.formData = {};
$scope.formData.businessDays = [{
name: "Monday",
value: "M",
selected: false
}, {
name: "Tuesday",
value: "T",
selected: false
}, {
name: "Wednesday",
value: "W",
selected: false
}, {
name: "Thursday",
value: "Th",
selected: false
}, {
name: "Friday",
value: "F",
selected: false
}, {
name: "Saturday",
value: "S",
selected: false
}, {
name: "Sunday",
value: "Su",
selected: false
}];
$scope.changed = function(value) {
if (value.selected) {
$scope.selectedItems.push(value.name);
} else {
var theIndex = $scope.selectedItems.indexOf(value.name);
if (theIndex != -1) {
$scope.selectedItems.splice(theIndex, 1);
}
}
}
并订阅 checkboxes
的 change
事件以使 属性 保持最新
<div class="col-sm-3" ng-repeat="days in formData.businessDays">
<input type="checkbox" ng-model="days.selected" ng-change="changed(days)"><span> {{days.name}} </span>
</div>
<div>
<p>selected values</p>
<label ng-repeat="item in selectedItems">{{item}} </label>
</div>
<div class="col-sm-3" ng-repeat="days in formdata.businessDays">
<input type="checkbox" ng-model="days.selected" ng-click="selected(days)">
<span> {{days.name}}</span>
</div>
并在控制器中
$scope.selected = function(d){
console.log(d);
}
$scope.formdata = {};
$scope.formdata.businessDays = [{
name: "Monday",
value: "M",
}, {
name: "Tuesday",
value: "T",
}, {
name: "Wednesday",
value: "W",
}, {
name: "Thursday",
value: "Th",
}, {
name: "Friday",
value: "F",
}, {
name: "Saturday",
value: "S",
}, {
name: "Sunday",
value: "Su",
},];
<div class="col-sm-3" ng-repeat="days in formData.businessDays">
<input type="checkbox" ng-model="days.Selected" ng-change=")"><span> {{days.name}}</span>
</div>
$scope.addData = function(form)
{
$scope.formData.days_id = [];
angular.forEach($scope.formData.businessDays, function(businessDays){
//console.log(businessDays);
if (businessDays.Selected) {
$scope.formData.days_id.push(businessDays.value);
}
})
}
嗨,这个问题已经问过了,但没有解决我的问题。
我正在将复选框值传递给控制器,但我无法确定选择了哪个。
这是我的代码
HTML:
<div class="col-sm-3" ng-repeat="days in formData.businessDays">
<input type="checkbox" ng-model="business_days.Selected" ng-change=""><span> {{days.name}}</span>
</div>
Js:
$scope.addData = function(form)
{
$scope.formData.days_id = [];
angular.forEach($scope.formData.businessDays, function(businessDays){
//console.log(businessDays);
if (businessDays.Selected) {
$scope.formData.days_id.push(businessDays.value);
}
})
}
//this days data values
$scope.formData.businessDays = [{
name: "Monday",
value: "M",
}, {
name: "Tuesday",
value: "T",
}, {
name: "Wednesday",
value: "W",
}, {
name: "Thursday",
value: "Th",
}, {
name: "Friday",
value: "F",
}, {
name: "Saturday",
value: "S",
}, {
name: "Sunday",
value: "Su",
}, ];
这是我的控制台图像
I can't identify which on is selected values ?
您必须为 $scope.formData.businessDays
中的每个 object
提供一个 属性 selected
以识别它是否被选中,例如 :-
$scope.selectedItems = [];
$scope.formData = {};
$scope.formData.businessDays = [{
name: "Monday",
value: "M",
selected: false
}, {
name: "Tuesday",
value: "T",
selected: false
}, {
name: "Wednesday",
value: "W",
selected: false
}, {
name: "Thursday",
value: "Th",
selected: false
}, {
name: "Friday",
value: "F",
selected: false
}, {
name: "Saturday",
value: "S",
selected: false
}, {
name: "Sunday",
value: "Su",
selected: false
}];
$scope.changed = function(value) {
if (value.selected) {
$scope.selectedItems.push(value.name);
} else {
var theIndex = $scope.selectedItems.indexOf(value.name);
if (theIndex != -1) {
$scope.selectedItems.splice(theIndex, 1);
}
}
}
并订阅 checkboxes
的 change
事件以使 属性 保持最新
<div class="col-sm-3" ng-repeat="days in formData.businessDays">
<input type="checkbox" ng-model="days.selected" ng-change="changed(days)"><span> {{days.name}} </span>
</div>
<div>
<p>selected values</p>
<label ng-repeat="item in selectedItems">{{item}} </label>
</div>
<div class="col-sm-3" ng-repeat="days in formdata.businessDays">
<input type="checkbox" ng-model="days.selected" ng-click="selected(days)">
<span> {{days.name}}</span>
</div>
并在控制器中
$scope.selected = function(d){
console.log(d);
}
$scope.formdata = {};
$scope.formdata.businessDays = [{
name: "Monday",
value: "M",
}, {
name: "Tuesday",
value: "T",
}, {
name: "Wednesday",
value: "W",
}, {
name: "Thursday",
value: "Th",
}, {
name: "Friday",
value: "F",
}, {
name: "Saturday",
value: "S",
}, {
name: "Sunday",
value: "Su",
},];
<div class="col-sm-3" ng-repeat="days in formData.businessDays">
<input type="checkbox" ng-model="days.Selected" ng-change=")"><span> {{days.name}}</span>
</div>
$scope.addData = function(form)
{
$scope.formData.days_id = [];
angular.forEach($scope.formData.businessDays, function(businessDays){
//console.log(businessDays);
if (businessDays.Selected) {
$scope.formData.days_id.push(businessDays.value);
}
})
}