From aef70efec7ee18311819b3106d0a5f4211e16192 Mon Sep 17 00:00:00 2001 From: Brian Ford Date: Mon, 12 Nov 2012 04:10:12 -0500 Subject: [PATCH] tabs directive now manages lifecycle of controllers --- js/directives/tabs.js | 81 ++++++++++++++++++++++++++++--------------- panel.html | 22 ++++-------- 2 files changed, 59 insertions(+), 44 deletions(-) diff --git a/js/directives/tabs.js b/js/directives/tabs.js index 9bd85cc..4e4ea7d 100644 --- a/js/directives/tabs.js +++ b/js/directives/tabs.js @@ -1,25 +1,8 @@ -panelApp.directive('batTabs', function() { +panelApp.directive('batTabs', function ($compile, $templateCache, $http) { return { restrict: 'E', transclude: true, scope: {}, - controller: function($scope, $element) { - var panes = $scope.panes = []; - - $scope.select = function(pane) { - angular.forEach(panes, function(pane) { - pane.selected = false; - }); - pane.selected = true; - } - - this.addPane = function(pane) { - if (panes.length === 0) { - $scope.select(pane); - } - panes.push(pane); - } - }, template: '
' + '
' + @@ -29,23 +12,65 @@ panelApp.directive('batTabs', function() { '' + '' + '
' + - '
' + + '
' + + '
' + '
', - replace: true + replace: true, + controller: function ($scope, $element) { + var panes = $scope.panes = []; + + this.addPane = function(pane) { + panes.push(pane); + }; + }, + link: function (scope, element, attr) { + + var lastScope; + var insideElt = angular.element(element[0].getElementsByClassName('bat-tabs-inside')[0]); + + function destroyLastScope() { + if (lastScope) { + lastScope.$destroy(); + lastScope = null; + } + } + + scope.select = function (pane) { + $http.get(pane.src, { cache: $templateCache }). + then(function (response) { + var template = response.data; + insideElt.html(template); + destroyLastScope(); + + var link = $compile(insideElt.contents()); + lastScope = scope.$new(); + link(lastScope); + }); + + angular.forEach(scope.panes, function(pane) { + pane.selected = false; + }); + pane.selected = true; + }; + + scope.select(scope.panes[0]); + } + }; }). directive('batPane', function() { return { require: '^batTabs', restrict: 'E', - transclude: true, - scope: { title: '@' }, - link: function(scope, element, attrs, tabsCtrl) { - tabsCtrl.addPane(scope); + scope: { + title: '@', + src: '@' }, - template: - '
' + - '
', - replace: true + link: function (scope, element, attrs, tabsCtrl) { + tabsCtrl.addPane({ + title: attrs.title, + src: attrs.src + }); + } }; }); diff --git a/panel.html b/panel.html index 6d6aa82..de5a103 100644 --- a/panel.html +++ b/panel.html @@ -40,21 +40,11 @@ - - - - - - - - - - - - - - - + + + + + - \ No newline at end of file +