使用angularjs指令icheck插件

Question

我的Angularjs应用程序出现问题，找不出问题出在哪里。

检查它plunker Here

，当我点击它应该运行I检查（）插件按钮，但它并不

Answer 1

你应该做一两件事来使一切工作：力AngularJS实际上使用jQuery。

AngularJS在其源代码中包含jQlite，但它与jQuery不一样。如果您在之前包含jQuery angular.js，那么Angular将使用它来代替自己的实现。

因此只需要改变这个index.html中：

<script data-require="jquery@*" data-semver="2.0.3" src="http://code.jquery.com/jquery-2.0.3.min.js"></script> 
<script data-require="angular.js@*" data-semver="1.2.9" src="http://code.angularjs.org/1.2.9/angular.js"></script> 

（jQuery是angular.js之前）

working Plunker

Answer 2

更好的I检查指令可以在这里找到：https://github.com/fronteed/iCheck/issues/62（wajatimur）

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'); 
      }) 

      return $(element).iCheck({ 
       checkboxClass: 'icheckbox_flat-aero', 
       radioClass: 'iradio_flat-aero' 

      }).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); 
        }); 
       } 
      }); 
     }); 
    } 
};