とある案件で、angularJS(1.x)でicheckを使おうと思ったところ、そのへんに落ちているサンプルをコピペしてもモバイルでうまく動かなくてハマった。
tripDirectives.directive('icheck', function($timeout, $parse) {
return {
require: 'ngModel',
link: function($scope, element, $attrs, ngModel) {
return $timeout(function() {
var value;
value = $attrs['value'];
$scope.$watch($attrs['ngModel'], function(newValue){
$(element).iCheck('update');
event.preventDefault(); //この行がないとモバイルでうまく動かない
event.stopPropagation(); //この行がないとモバイルでうまく動かない
})
$(element).on('')
return $(element).iCheck({
checkboxClass: 'icheckbox_flat',
radioClass: 'iradio_flat'
}).on('ifChanged', function(event) {
if ($(element).attr('type') === 'checkbox' && $attrs['ngModel']) {
$scope.$apply(function() {
return ngModel.$setViewValue(event.target.checked);
});
}
if ($(element).attr('type') === 'radio' && $attrs['ngModel']) {
return $scope.$apply(function() {
return ngModel.$setViewValue(value);
});
}
});
});
}
};
});
どうやら2回発火してしまっていることが原因だったので、propergationを切ってあげたところ、うまくいった。