From fb5cd593c6fb71f9125fe9a7cecc6d3188314d67 Mon Sep 17 00:00:00 2001
From: Charles Himmer <charleshimmer@gmail.com>
Date: Wed, 2 Mar 2016 08:58:08 -0600
Subject: [PATCH] You can't use tabs in a modal unless you re-init the tabs
 plugin after the modal has been rendered and shown. This fixes that by
 hooking into the modal ready callback and re-initing the tabs inside the
 modal.

---
 src/angular-materialize.js | 12 +++++++++++-
 1 file changed, 11 insertions(+), 1 deletion(-)

diff --git a/src/angular-materialize.js b/src/angular-materialize.js
index fbcd1c4..3ed8390 100644
--- a/src/angular-materialize.js
+++ b/src/angular-materialize.js
@@ -846,22 +846,32 @@
                 link: function (scope, element, attrs) {
                     $timeout(function () {
                         var modalEl = $(attrs.href ? attrs.href : '#' + attrs.target);
+                        var readyFn = function() {
+                          if (angular.isFunction(scope.ready)) {
+                            scope.$eval(scope.ready());
+                          }
+                          // If we are using tabs in a modal we need to re-init the tabs
+                          // See https://github.com/Dogfalo/materialize/issues/1634
+                          modalEl.find('ul.tabs').tabs();
+                        };
                         $compile(element.contents())(scope);
                         element.leanModal({
                             dismissible: (angular.isDefined(scope.dismissible)) ? scope.dismissible : undefined,
                             opacity: (angular.isDefined(scope.opacity)) ? scope.opacity : undefined,
                             in_duration: (angular.isDefined(scope.inDuration)) ? scope.inDuration : undefined,
                             out_duration: (angular.isDefined(scope.outDuration)) ? scope.outDuration : undefined,
-                            ready: (angular.isDefined(scope.ready)) ? function() {scope.$eval(scope.ready())} : undefined,
+                            ready: readyFn,
                             complete: (angular.isDefined(scope.complete)) ? function() {scope.$eval(scope.complete())} : undefined,
                         });
 
+                        // Setup watch for opening / closing modal programatically.
                         if (angular.isDefined(attrs.open) && modalEl.length > 0) {
                           scope.$watch('open', function(value, lastValue) {
                             if (!angular.isDefined(value)) { return; }
                             (value === true) ? modalEl.openModal() : modalEl.closeModal();
                           });
                         }
+
                     });
                 }
             };