Обновить bootstrapswitch после изменения в ngModel

#javascript #angularjs #bootstrap-switch

#javascript #angularjs #bootstrap-переключатель

Вопрос:

Я использую angular 1.4.x и шаблон Bluradmin. Проблема связана с пользовательской директивой bootstrapswitch

 (function () {
  'use strict';

  angular.module('BlurAdmin.pages.form')
      .directive('switch', switchDirective);

  /** @ngInject */
  function switchDirective($timeout) {
    return {
      restrict: 'EA',
      replace: true,
      scope: {
    ngModel: '='
      },
      template: function(el, attrs) {
    return '<div class="switch-container '   (attrs.color || '')   '"><input type="checkbox" ng-model="ngModel"></div>';
      },
      link: function (scope, elem, attr) {
    $timeout(function(){
      var input = $(elem).find('input');
      input.bootstrapSwitch({
        size: 'small',
        onColor: attr.color
      });
      input.on('switchChange.bootstrapSwitch', function(event, state) {
        scope.ngModel = state;
        scope.$apply();
      });

    }, 2000);
      }
    };
  }
})();
  

Он загружается правильно только один раз во время рендеринга DOM, а затем, после изменений в ngModel, он не обновляется. Как я могу этого добиться?
кстати, я могу переключить его вручную, но это не имеет значения.

Ответ №1:

Решение было простым: не использовать эту директиву. Вместо этого используйте: https://github.com/JumpLink/angular-toggle-switch (особенно обратите внимание на его атрибут is-disabled, который будет работать при изменении ngModel. Альтернативное решение не имеет этой функции:https://github.com/frapontillo/angular-bootstrap-switch/issues/96 )