From be7ecff01c150676337a3d52a6ff84d03b969c08 Mon Sep 17 00:00:00 2001
From: Andy Joslin <andytjoslin@gmail.com>
Date: Fri, 28 Jun 2013 14:51:26 -0400
Subject: [PATCH] fix(tabs): make tab contents be correctly connected to parent
 (#524)

* Make tab contents be compiled into outer scope after being appended to
tab-pane elements.
---
 src/tabs/tabs.js          |  9 ++++++++-
 src/tabs/test/tabsSpec.js | 14 ++++++++++++++
 2 files changed, 22 insertions(+), 1 deletion(-)

diff --git a/src/tabs/tabs.js b/src/tabs/tabs.js
index 2a0a620694..851569c32e 100644
--- a/src/tabs/tabs.js
+++ b/src/tabs/tabs.js
@@ -17,6 +17,11 @@ angular.module('ui.bootstrap.tabs', [])
 
 .controller('TabsetController', ['$scope', '$element', 
 function TabsetCtrl($scope, $element) {
+
+  //Expose the outer scope for tab content compiling, so it can compile
+  //on outer scope like it should
+  this.$outerScope = $scope.$parent;
+   
   var ctrl = this,
     tabs = ctrl.tabs = $scope.tabs = [];
 
@@ -280,15 +285,17 @@ function($parse, $http, $templateCache, $compile) {
   };
 }])
 
-.directive('tabContentTransclude', ['$parse', function($parse) {
+.directive('tabContentTransclude', ['$compile', '$parse', function($compile, $parse) {
   return {
     restrict: 'A',
     require: '^tabset',
     link: function(scope, elm, attrs, tabsetCtrl) {
+      var outerScope = tabsetCtrl.$outerScope;
       scope.$watch($parse(attrs.tabContentTransclude), function(tab) {
         elm.html('');
         if (tab) {
           elm.append(tab.contentElement);
+          $compile(tab.contentElement)(outerScope);
         }
       });
     }
diff --git a/src/tabs/test/tabsSpec.js b/src/tabs/test/tabsSpec.js
index df65d806db..ddaff4f28f 100644
--- a/src/tabs/test/tabsSpec.js
+++ b/src/tabs/test/tabsSpec.js
@@ -475,4 +475,18 @@ describe('tabs', function() {
     });
   });
 
+  //https://github.com/angular-ui/bootstrap/issues/524
+  describe('child compilation', function() {
+
+    var elm;
+    beforeEach(inject(function($compile, $rootScope) {
+      elm = $compile('<tabset><tab><div></div></tab></tabset></div>')($rootScope.$new());
+      $rootScope.$apply();
+    }));
+
+    it('should hookup the tab\'s children to the tab with $compile', function() {
+      var tabChild = $('.tab-pane', elm).children().first();
+      expect(tabChild.inheritedData('$tabsetController')).toBeTruthy();
+    });
+  });
 });