angular-ui-switch

angular-ui-switch copied to clipboard

The ng-disabled is not working. I changed the code a little bit is order to adjust the directive to the ng-disabled. Hope you will update it on the repo

angular.module('uiSwitch', [])

.directive('switch', function(){
  return {
    restrict: 'AE'
  , replace: true
  , transclude: true
  , template: function(element, attrs) {
      var html = '';
      html += '<span';
      html +=   ' class="switch' + (attrs.class ? ' ' + attrs.class : '') + '"';
      html +=   attrs.ngModel ? ' ng-click="' + attrs.ngDisabled + ' ? ' + attrs.ngModel + ' : ' + attrs.ngModel + '=!' + attrs.ngModel + (attrs.ngChange ? '; ' + attrs.ngChange + '()"' : '"') : '';
      html +=   ' ng-class="{ checked:' + attrs.ngModel + ', disabled:' + attrs.ngDisabled + ' }"';
      html +=   '>';
      html +=   '<small></small>';
      html +=   '<input type="checkbox"';
      html +=     attrs.id ? ' id="' + attrs.id + '"' : '';
      html +=     attrs.name ? ' name="' + attrs.name + '"' : '';
      html +=     attrs.ngModel ? ' ng-model="' + attrs.ngModel + '"' : '';
      html +=     attrs.ngDisabled ? ' ng-disabled="' + attrs.ngDisabled +'"' : '';
      html +=     ' style="display:none" />';
      html +=     '<span class="switch-text">'; /*adding new container for switch text*/
      html +=     attrs.on ? '<span class="on">'+attrs.on+'</span>' : ''; /*switch text on value set by user in directive html markup*/
      html +=     attrs.off ? '<span class="off">'+attrs.off + '</span>' : ' ';  /*switch text off value set by user in directive html markup*/
      html += '</span>';
      return html;
    }
  }
});

is there a toggle method ? I mean I was struggling with this and copied this code and now I'm able to disable the switches, but I want to select a switch and disable the other one automatically...

@AcarMeel you can use this ui-switch https://github.com/hjzheng/angular-switch

That is worked. html += attrs.ngModel ? ' ng-click="' + (attrs.disabled ? attrs.ngModel : attrs.ngModel + '=!' + attrs.ngModel) + (attrs.ngChange ? '; ' + attrs.ngChange + '()"' : '"') : '';

But the attrs.disabled is always true in ng-click. In ng-class, attrs.disabled works fine.