0

我正在使用这里Tabs (ui.bootstrap.tabs)描述的控制\指令。该控件创建它自己的控制器，该控制器设置活动选项卡：

.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();
  };

Tabset 子选项卡控件（子元素）在单击时可以触发父级的选择功能。

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

我有我的自定义控制器向上的 DOM 需要触发select功能TabsetController以设置第一个选项卡处于活动状态。我读过我可以使用事件广播，但我无法修改TabsetController绑定事件侦听器，所以这似乎不是一个可行的选择。有什么建议么？

编辑：

请参阅 Plunker 以获得更好的理解 -在这里。

4

1 回答 1

0

您可以在“父”控制器中声明范围属性，并且可以在子控制器中访问它。请参阅：AngularJS - 访问子范围

因为 TabsetController 设置在子 DOM 元素上，而 MainController 设置在父元素上，所以您可以在 MainController 中定义和操作 $scope.tabs，它将在 TabsetController 中看到和解释。

于 2014-07-14T09:15:27.863 回答