как я могу выбрать вкладку из внешнего контроллера

Я использую Tabs (ui.bootstrap.tabs) control\directive, описанную здесь. Элемент управления создает свой собственный контроллер, который устанавливает активную вкладку:

.controller('TabsetController', ['$scope', function TabsetCtrl($scope) {
  var ctrl = this,
      tabs = ctrl.tabs = $scope.tabs = [];

  ctrl.select = function(selectedTab) {
    angular.forEach(tabs, function(tab) {
      if (tab.active && tab !== selectedTab) {
        tab.active = false;
        tab.onDeselect();
      }
    });
    selectedTab.active = true;
    selectedTab.onSelect();
  };

Элементы управления дочерними вкладками набора вкладок (дочерние элементы) могут запускать родительскую функцию выбора при нажатии на них.

.directive('tab', ['$parse', function($parse) {
  return {
    require: '^tabset',
    scope: {
      onSelect: '&select',

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

ИЗМЕНИТЬ:

Для лучшего понимания см. Plunker — здесь.


person Max Koretskyi    schedule 13.07.2014    source источник
comment
не ясно, чем ваша установка отличается от демо. Демонстрация показывает, как переключать вкладки уже на уровне локального контроллера. Можете ли вы изменить пример plunker, чтобы показать больше о вашей проблеме?   -  person charlietfl    schedule 13.07.2014
comment
Здесь я создал планк. Что мне нужно сделать, так это всегда выбирать первую вкладку всякий раз, когда происходит щелчок по слову внутри контейнера div.words. В настоящее время, если выбрана вторая вкладка и есть щелчок по слову внутри div.words, вторая вкладка остается активной.   -  person Max Koretskyi    schedule 14.07.2014
comment
это то, что вы ищете? plnkr.co/edit/qJcMXVRQvBhQCMkvZsM3?p=preview   -  person kihu    schedule 14.07.2014
comment
Спасибо, но я не понимаю, как это работает. Для определения директивы требуется контроллер, который содержит эту строку tabs = ctrl.tabs = $scope.tabs = [];. Так как же свойство tabs распределяется между MainController и TabsetController, что требуется директивой tabset?   -  person Max Koretskyi    schedule 14.07.2014
comment
Эй, я добавил объяснение в ответ. Я не вижу строки, которую вы упоминаете в демонстрации начальной загрузки, откуда вы ее взяли?   -  person kihu    schedule 14.07.2014
comment
Второй комментарий к этому вопросу должен быть в самом вопросе.   -  person pixelbits    schedule 14.07.2014
comment
@pixelbits, да, вы правы, я создал еще один отдельный вопрос здесь.   -  person Max Koretskyi    schedule 14.07.2014


Ответы (1)


Вы можете объявить атрибут области в «родительском» контроллере, и он будет доступен в дочернем контроллере. см.: AngularJS — доступ к дочерней области

Поскольку TabsetController установлен на дочернем элементе DOM, а MainController установлен на родительском элементе, вы можете определить и управлять $scope.tabs в MainController, и он будет виден и интерпретирован в TabsetController.

person kihu    schedule 14.07.2014
comment
Спасибо, но свойство tabs переопределяется этой строкой: tabs = ctrl.tabs = $scope.tabs = [];. Вы можете увидеть эту строку в TabsetController определении внутри ui.bootstrap.js файла здесь . - person Max Koretskyi; 14.07.2014