AngularJS директивы аккордеона, события и как go об их использовании - PullRequest
Новая
       16

AngularJS директивы аккордеона, события и как go об их использовании

0 голосов
/ 09 апреля 2020

Вероятно, мне следует начать с предупреждения об уровне невежества, с которым вы разговариваете. Я не новичок в SPA, но сначала я посмотрел на AngularJS две недели go.

Как я понимаю, директива определяет пользовательские теги разметки, чтобы их можно было преобразовать в сгенерированный скрипт в какая-то фаза препроцессора, и каждый логический элемент виджета будет выражаться как директива. Таким образом, в случае аккордеона, полного аккордеонных групп, у нас есть директива аккордеона и директива аккордеонной группы.

Я нашел это в нашем дереве исходных текстов, но комментарии вверху файла заставляют меня задуматься это Angular - Bootstrap код, не написанный внутри компании. 

.directive('accordionGroup', function() {
  return {
    require:'^accordion',         // We need this directive to be inside an accordion
    restrict:'EA',
    transclude:true,              // It transcludes the contents of the directive into the template
    replace: true,                // The element containing the directive will be replaced with the template
    templateUrl:'template/accordion/accordion-group.html',
    scope: {
      heading: '@',               // Interpolate the heading attribute onto this scope
      isOpen: '=?',
      isDisabled: '=?'
    },
    controller: function() {
      this.setHeading = function(element) {
        this.heading = element;
      };
    },
    link: function(scope, element, attrs, accordionCtrl) {
      accordionCtrl.addGroup(scope);

      scope.$watch('isOpen', function(value) {
        if ( value ) {
          accordionCtrl.closeOthers(scope);
        }
      });

      scope.toggleOpen = function() {
        if ( !scope.isDisabled ) {
          scope.isOpen = !scope.isOpen;
        }
      };
    }
  };
})

Было бы довольно просто изменить этот 

      scope.toggleOpen = function() {
        if ( !scope.isDisabled ) {
          scope.isOpen = !scope.isOpen;
        }
      };

для вызова функции-обработчика всякий раз, когда группа аккордеона открывается, вот так 

      scope.toggleOpen = function() {
        if ( !scope.isDisabled ) {
          scope.isOpen = !scope.isOpen;
          if (scope.isOpen) {
             myAccordionGroupOpenHandler(scope);
          }
        }
      };

, но это кажется агрессивным и маловероятным для лучшей практики.

И вот почему я публикую на Stack Overflow: что является рекомендуемым или, по крайней мере, обычным способом установить такой обработчик событий?

...