{"id":13403389,"url":"https://github.com/frapontillo/angular-bootstrap-switch","last_synced_at":"2025-04-06T21:14:22.801Z","repository":{"id":9790536,"uuid":"11766324","full_name":"frapontillo/angular-bootstrap-switch","owner":"frapontillo","description":"AngularJS directive for the bootstrap-switch jQuery plugin.","archived":false,"fork":false,"pushed_at":"2017-12-01T11:42:57.000Z","size":210,"stargazers_count":299,"open_issues_count":7,"forks_count":107,"subscribers_count":18,"default_branch":"develop","last_synced_at":"2025-03-25T06:04:16.316Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":null,"language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"apache-2.0","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/frapontillo.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","contributing":"CONTRIBUTING.md","funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2013-07-30T13:57:43.000Z","updated_at":"2025-01-24T14:28:57.000Z","dependencies_parsed_at":"2022-08-29T08:42:28.089Z","dependency_job_id":null,"html_url":"https://github.com/frapontillo/angular-bootstrap-switch","commit_stats":null,"previous_names":[],"tags_count":14,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/frapontillo%2Fangular-bootstrap-switch","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/frapontillo%2Fangular-bootstrap-switch/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/frapontillo%2Fangular-bootstrap-switch/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/frapontillo%2Fangular-bootstrap-switch/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/frapontillo","download_url":"https://codeload.github.com/frapontillo/angular-bootstrap-switch/tar.gz/refs/heads/develop","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":247266563,"owners_count":20910836,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":[],"created_at":"2024-07-30T19:01:29.338Z","updated_at":"2025-04-06T21:14:22.784Z","avatar_url":"https://github.com/frapontillo.png","language":"JavaScript","readme":"angular-bootstrap-switch\n========================\n\n[![Bower version][bower-version-image]][bower-url]\n[![NPM version][npm-version-image]][npm-url]\n[![Build Status][travis-image]][travis-url]\n[![Apache License][license-image]][license-url]\n\nAngularJS directive for the [bootstrap-switch](https://github.com/nostalgiaz/bootstrap-switch) jQuery plugin.\n\n## Usage\n\n### Installation\n```shell\n$ bower install angular-bootstrap-switch\n```\n\nor\n\n```shell\n$ npm install angular-bootstrap-switch\n```\n\nThis will install AngularJS, jQuery, and the original bootstrap-switch.\n\n### Registration\n\nTo be able to use the directive, you need to register the `angular-bootstrap-switch` module as a dependency:\n\n```javascript\nangular.module('yourModule', ['frapontillo.bootstrap-switch'\n    // other dependencies\n]);\n```\n\n### Directive\nThe directive can work on both element and attribute levels. The following example contains all of the supported attributes:\n\n```html\n\u003cinput\n    bs-switch\n    ng-model=\"isSelected\"\n    type=\"checkbox\"\n    switch-active=\"{{ isActive }}\"\n    switch-readonly=\"{{ isReadonly }}\"\n    switch-size=\"{{ size }}\"\n    switch-animate=\"{{ animate }}\"\n    switch-label=\"{{ label }}\"\n    switch-icon=\"{{ icon }}\"\n    switch-on-text=\"{{ onLabel }}\"\n    switch-off-text=\"{{ offLabel }}\"\n    switch-on-color=\"{{ on }}\"\n    switch-off-color=\"{{ off }}\"\n    switch-radio-off=\"{{ radioOff }}\"\n    switch-label-width=\"{{ labelWidth }}\"\n    switch-handle-width=\"{{ handleWidth }}\"\n    switch-inverse=\"{{ inverse }}\"\n    switch-change=\"onChange()\"\n    ng-true-value=\"'yep'\"\n    ng-false-value=\"'nope'\"\u003e\n```\n\nShort doc for all of the attributes:\n\n* `ng-model`, the value to bind the switch to\n* `type`, has to be one of `checkbox` and `radio`.\nThis value is mandatory and must be a string, as it cannot be changed once set (see [this answer on StackOverflow](http://stackoverflow.com/a/15155407/801065)).\nIf you choose `radio`, be sure to follow the [AngularJS radio specs](https://docs.angularjs.org/api/ng/input/input%5Bradio%5D),\nmeaning you have to specify the same `ngModel` and a different `value` or `ng-value` attribute for each radio\n* `switch-active`, determines if the switch is enabled or not (changes the inner input's `disabled` attribute)\n* `switch-readonly`, determines if the switch is read-only or not (changes the inner input's `readonly` attribute)\n* `switch-size`, can be the empty string as default, `mini`, `small`, `large`\n* `switch-animate`, determines if the switch animates when toggled\n* `switch-on-text`, sets the positive (checked) text\n* `switch-off-text`, sets the negative (unchecked) text\n* `switch-on-color`, sets the positive (checked) class, can be `primary` (as default), `default`, `info`, `success`, `warning`, `danger`\n* `switch-off-color`, sets the negative (unchecked) class, can be `default` (as default), `primary`, `info`, `success`, `warning`, `danger`\n* `switch-label`, sets the toggle label\n* `switch-icon`, sets the toggle icon (e.g. `icon-save`)\n* `switch-wrapper`, sets the main container class, use a falsy value to fall back to the default one\n* `switch-radio-off`, allows a radio button to be unchecked by the user (from `true` to `false`)\n* `switch-label-width`, sets the width of the middle label\n* `switch-handle-width`, sets the width of both handles\n* `switch-inverse`, inverts the on/off handles\n* `switch-change`, evaluates an expression whenever the model value changes. Instead, `ng-change` will fire when view value changes (e.g from a click)\n\n### Migrating from bootstrap-switch~2\n\nRead the [CHANGELOG](CHANGELOG.md#030-alpha1-2014-02-22) information to learn what's different in `0.3.0`.\n\n### Examples\n\nThe `example` folder shows a simple working demo of the switch.\n\n### Compatibility\n\nIE8 requires you to attach the directive to an `\u003cinput type=\"checkbox\"\u003e` or `\u003cinput type=\"radio\"\u003e`. Due to some incompatibilities it is not possible to use a custom tag or `div` instead.\n\n## Development\n\n### Test and build\n\nTo build the directive yourself you need to have NodeJS. Then do the following:\n\n```shell\n$ npm install -g grunt-cli bower karma\n$ npm install\n$ bower install\n$ grunt test-travis\n$ grunt build\n```\n\n### Contribute\n\nTo contribute, please follow the generic [AngularJS Contributing Guidelines](https://github.com/angular/angular.js/blob/master/CONTRIBUTING.md), with the only exception to send the PR to the `develop` branch instead of `master`.\n\n## Author\n\nFrancesco Pontillo (\u003cmailto:francescopontillo@gmail.com\u003e)\n\n## License\n\n```\n   Copyright 2014-2017 Francesco Pontillo\n\n   Licensed under the Apache License, Version 2.0 (the \"License\");\n   you may not use this file except in compliance with the License.\n   You may obtain a copy of the License at\n\n     http://www.apache.org/licenses/LICENSE-2.0\n\n   Unless required by applicable law or agreed to in writing, software\n   distributed under the License is distributed on an \"AS IS\" BASIS,\n   WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n   See the License for the specific language governing permissions and\n   limitations under the License.\n\n```\n\n[license-image]: http://img.shields.io/badge/license-Apache_2.0-blue.svg?style=flat\n[license-url]: LICENSE\n\n[bower-version-image]: http://img.shields.io/bower/v/angular-bootstrap-switch.svg?style=flat\n[bower-url]: http://bower.io/search/?q=angular-bootstrap-switch\n\n[npm-url]: https://npmjs.org/package/angular-bootstrap-switch\n[npm-version-image]: http://img.shields.io/npm/v/angular-bootstrap-switch.svg?style=flat\n\n[travis-image]: http://img.shields.io/travis/frapontillo/angular-bootstrap-switch/develop.svg?style=flat\n[travis-url]: https://travis-ci.org/frapontillo/angular-bootstrap-switch\n","funding_links":[],"categories":["JavaScript"],"sub_categories":[],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Ffrapontillo%2Fangular-bootstrap-switch","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Ffrapontillo%2Fangular-bootstrap-switch","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Ffrapontillo%2Fangular-bootstrap-switch/lists"}