jQuery Layout Plugin + AngularJS Tabs

Question

Я использую jQuery layout plugin. Внутри панели я использую вкладки, созданные angularjs (код ниже). Когда я закрываю панель макета (южная панель в jsfiddle) и открываю ее снова, вкладки больше не работают. Изменение размера не вызывает этой проблемы.

directive('tabs', function() { 
    return { 
     restrict: 'E', 
     transclude: true, 
     scope: {}, 
     controller: function ($scope, $element) { 
      var tabpanes = $scope.tabpanes = []; 

      $scope.select = function (tabpane) { 
       angular.forEach(tabpanes, function (tabpane) { 
        tabpane.selected = false; 
       }); 
       tabpane.selected = true; 
      } 

    this.addTabPane = function (tabpane) { 
       if (tabpanes.length == 0) $scope.select(tabpane); 
       tabpanes.push(tabpane); 
      } 
    }, 
     template: 
     '<div class="tabbable">' + 
     '<ul class="nav nav-tabs">' + 
     '<li ng-repeat="tabpane in tabpanes" ng-class="{active:tabpane.selected}">' + 
     '<a href="" ng-click="select(tabpane)">{{tabpane.title}}</a>' + 
     '</li>' + 
     '</ul>' + 
     '<div class="tab-content" ng-transclude></div>' + 
     '</div>', 
     replace: true 
    }; 
}). 
directive('tabpane', function() { 
    return { 
     require: '^tabs', 
     restrict: 'E', 
     transclude: true, 
     scope: { title: '@' }, 
     link: function (scope, element, attrs, tabsCtrl) { 
      tabsCtrl.addTabPane(scope); 
     }, 
     template: 
     '<div class="tab-pane" ng-class="{active: selected}" ng-transclude>' + 
     '</div>', 
     replace: true 
    }; 
}) 

jsfiddle: http://jsfiddle.net/jfn5z/84/

Answer 1

Почему вы не используете angular-ui-bootstrap или angular-strap

Или пожалуйста jsfiddle или pluncker.

Answer 2

Я надеюсь, что это поможет вам

Working ==>fiddlehttp://jsfiddle.net/Nishchit14/jfn5z/85/