nir*_*mal 5 javascript angularjs
我创建了一个复选框的指令,它创建了一个图像层,但问题是,即使输入框检查值被更改,它也不会触发更改事件
指示
function icheck($timeout,$parse) {
return {
restrict: 'A',
link: function ($scope, element, $attrs, $watch) {
var value = $attrs['value'],
ngModelGetter = $parse($attrs['ngModel']);
return $timeout(function () {
$scope.$watch($attrs.ngModel, function (newValue) {
$(element).iCheck('update');
});
$(element).iCheck({
checkboxClass: 'icheckbox_square-green',
radioClass: 'iradio_square-green'
}).on('ifChanged', function (event) {
var elemType = $(element).attr('type');
if (elemType === 'checkbox' && $attrs.ngModel) {
$scope.$apply(function () {
console.log(event.target.checked)
return ngModelGetter.assign($scope, event.target.checked);
});
}
else if (elemType === 'radio' && $attrs.ngModel) {
return $scope.$apply(function () {
return ngModelGetter.assign($scope, value);
});
}
});
});
}
};
}
Run Code Online (Sandbox Code Playgroud)
HTML低于
<input type="checkbox" class="i-checks" data-icheck ng-change="alert('changed!')" ng-model="chekal" id="chkSelectAll">
Run Code Online (Sandbox Code Playgroud)
任何想法如何我甚至点击事件触发更改事件将是好的.
我所做的是在属性中传递函数值
<input type="checkbox" class="i-checks" data-icheck data-function="selectAll" ng-model="chekal" id="chkSelectAll">
Run Code Online (Sandbox Code Playgroud)
指示
if (elemType === 'checkbox' && $attrs.ngModel) {
$scope.$apply(function () {
console.log(event.target.checked)
var f = $(event.target).data('function');
console.log(f);
if (f !== "undefined" || f !== "") {
eval('$scope.' + f + '(event)');
}
return ngModelGetter.assign($scope, event.target.checked);
});
}
Run Code Online (Sandbox Code Playgroud)
所以我用 eval 来调用这个函数。这个答案仅供参考,也可以帮助其他人。
我不想添加临时的手表,所以在不增加手表的情况下就这样做了,并以更多的性能方式解决了问题。
| 归档时间: |
|
| 查看次数: |
3814 次 |
| 最近记录: |