angular-ui-switch copy.js 1.3 KB

12345678910111213141516171819202122232425262728
  1. angular.module('uiSwitch', [])
  2. .directive('switch', function() {
  3. return {
  4. restrict: 'AE',
  5. replace: true,
  6. transclude: true,
  7. template: function(element, attrs) {
  8. var html = '';
  9. html += '<span';
  10. html += ' class="switch' + (attrs.class ? ' ' + attrs.class : '') + '"';
  11. html += attrs.ngModel ? ' ng-click="' + attrs.ngModel + '=!' + attrs.ngModel + (attrs.ngChange ? '; ' + attrs.ngChange + '()"' : '"') : '';
  12. html += ' ng-class="{ checked:' + attrs.ngModel + ' }"';
  13. html += '>';
  14. html += '<small></small>';
  15. html += '<input type="checkbox"';
  16. html += attrs.id ? ' id="' + attrs.id + '"' : '';
  17. html += attrs.name ? ' name="' + attrs.name + '"' : '';
  18. html += attrs.ngModel ? ' ng-model="' + attrs.ngModel + '"' : '';
  19. html += ' style="display:none" />';
  20. html += '<span class="switch-text">'; /*adding new container for switch text*/
  21. html += attrs.on ? '<span class="on">' + attrs.on + '</span>' : ''; /*switch text on value set by user in directive html markup*/
  22. html += attrs.off ? '<span class="off">' + attrs.off + '</span>' : ' '; /*switch text off value set by user in directive html markup*/
  23. html += '</span>';
  24. return html;
  25. }
  26. }
  27. });