ФорумПрограммированиеJavaScriptAngularJS → Директива для Switchery

Директива для Switchery

  • adw0rd

    Сообщения: 22959 Репутация: N Группа: в ухо

    Spritz 12 марта 2015 г. 18:46

    Есть такие красивые iOS7 переключатели, реализация на js http://abpetkov.github.io/switchery/

    Вот для него директива (взял из темы inspinia+)


    'use strict';

    /**
    * Module to use Switchery as a directive for angular.
    * @TODO implement Switchery as a service, https://github.com/abpetkov/switchery/pull/11
    */
    angular.module('ui.switchery', [])
    .directive('uiSwitch', ['$window', '$timeout','$log', '$parse', function($window, $timeout, $log, $parse) {

    /**
    * Initializes the HTML element as a Switchery switch.
    *
    * @TODO add a way to provide options for Switchery
    * $timeout is in place as a workaround to work within angular-ui tabs.
    *
    * @param scope
    * @param elem
    * @param attrs
    */
    function linkSwitchery(scope, elem, attrs, ngModel) {
    if(!ngModel) return false;
    var options = {};
    try {
    options = $parse(attrs.uiSwitch)(scope);
    }
    catch (e) {}
    $timeout(function() {
    var switcher = new $window.Switchery(elem[0], options);
    var element = switcher.element;
    element.checked = scope.initValue;
    switcher.setPosition(false);
    element.addEventListener('change',function(evt) {
    scope.$apply(function() {
    ngModel.$setViewValue(element.checked);
    })
    })
    }, 0);
    }
    return {
    require: 'ngModel',
    restrict: 'AE',
    scope : {initValue : '=ngModel'},
    link: linkSwitchery
    }
    }]);


    Спустя 90 сек.


    О, нашел более свежую имплементацию https://github.com/servergrove/NgSwitchery/blob/master/src/ng-switchery.js
    https://smappi.org/ - платформа по созданию API на все случаи жизни

Пожалуйста, авторизуйтесь, чтобы написать комментарий!