作为一个angularjs的小白,今天用angularjs1.x版本开发的时候,遇到了一个问题。
$scope.songdan=function(){
var arr=new Array();
console.log($scope.tiantian);
if ($scope.tiantian==true) arr.push("tiantian");
if ($scope.quanfeng==true) arr.push("quanfeng");
if ($scope.yousu==true) arr.push("yousu");
if ($scope.yuantong==true) arr.push("yuantong");
if ($scope.zhongtong==true) arr.push("zhongtong");
if ($scope.yunda==true) arr.push("yunda");
if ($scope.huitong==true) arr.push("huitong");
console.log(arr);
};
代码是从segmentfault的问题上找的angularjs中ng-model绑定复选框的值无法获取
这样的绑定方式,angularjs不能实现双向绑定。
可以把ng-model都绑定在一个对象上进行初始化。
$scope.type =
all_results_checked : false
error_results_checked : false
authority_results_checked : false
label
input(
type="checkbox" ng-model="type.all_results_checked" ng-true-value="true"
ng-false-value="false" name="all" ng-click="toggleResultsChecked('all', type.all_results_checked)"
)
| 全选
label.space-l
input(
type="checkbox" ng-model="type.error_results_checked" ng-true-value="true" ng-false-value="false" name="error"
ng-click="toggleResultsChecked('运行失败', type.error_results_checked)"
)
| 运行失败
label.space-l
input(
type="checkbox" ng-model="type.authority_results_checked" name="authority"
ng-true-value="true" ng-false-value="false" ng-click="toggleResultsChecked('权限限制', type.authority_results_checked)"
)
| 权限限制
高级一点的可以修改angular本身关于input的修改(没有试过mark一下):
angular.module('core').directive('input', function () {
return {
priority: 1000,
restrict: 'E',
require: '?ngModel',
link: function (scope, element, attr, ctrl) {
if (attr.type === 'checkbox' && ctrl && attr.value) {
ctrl.$parsers = [];
ctrl.$parsers.push(parserFn);
ctrl.$formatters = [];
ctrl.$formatters.push(formatterFn);
}
function formatterFn(val) {
if (angular.isString(val)) {
return val === attr.value;
} else if (angular.isArray(val)) {
for (var i = 0; i < val.length; i++) {
if (val[i] === attr.value) {
return true;
}
}
return false;
}
}
function parserFn(val) {
if (angular.isString(ctrl.$modelValue)) {
if (ctrl.$modelValue === '') {
return val ? attr.value : '';
}
return val ?
(attr.value !== ctrl.$modelValue ? [ctrl.$modelValue, attr.value] : ctrl.$modelValue) :
(attr.value === ctrl.$modelValue ? '' : ctrl.$modelValue);
} else if (angular.isArray(ctrl.$modelValue)) {
var $$modelValue = ctrl.$modelValue.slice(0);
if ($$modelValue.length === 0) {
if (val) {
$$modelValue.push(attr.value);
}
return $$modelValue;
}
var existsBool = false;
for (var i = 0; i < $$modelValue.length; i++) {
if ($$modelValue[i] === attr.value) {
if (val) {
existsBool = true;
break;
} else {
$$modelValue.splice(i, 1);
}
}
}
if (val && !existsBool) {
$$modelValue.push(attr.value);
}
return $$modelValue;
}
return val;
}
}
};
});