Angularjs 实现 switch 开关

下面是实现效果：

AngularJS 实现代码:

ro.directive('toggle',[function(){return {restrict: 'E',        replace: true,        scope:{            'ngModel':'='        },template:'<label class="ro-switch"><input type="checkbox" ng-model="ngModel" ng-checked="ngModel"><div class="slider"><div class="slider-thumb"></div></div></label>',link:function(scope,elm,attr){}}}]);

CSS端代码:

/* switch 开关 */.ro-switch{  display: inline-block;cursor:pointer;  > input{display: none;}  .slider{    padding: 2px 25px 2px 3px;    background:#CCCCCC;     > .slider-thumb {      width:18px;height:18px;background:#FFF;     }     transition: padding 0.2s ease-in-out,background 0.2s ease-in-out;  }  > input:checked + .slider{background:#2196F3;padding: 2px 3px 2px 25px;}}