diff --git a/src/components/tabs/js/tabsController.js b/src/components/tabs/js/tabsController.js index f2f7a5e912b..7fa21fd73f3 100644 --- a/src/components/tabs/js/tabsController.js +++ b/src/components/tabs/js/tabsController.js @@ -6,7 +6,7 @@ angular * @ngInject */ function MdTabsController ($scope, $element, $window, $timeout, $mdConstant, $mdTabInkRipple, - $mdUtil, $animate, $attrs, $compile, $mdTheming, $parse) { + $mdUtil, $animate, $attrs, $compile, $mdTheming) { //-- define private properties var ctrl = this, locked = false, @@ -15,9 +15,6 @@ function MdTabsController ($scope, $element, $window, $timeout, $mdConstant, $md destroyed = false, loaded = false; - //-- define two-way binding - defineBinding('selectedIndex', 'mdSelected', 0, handleSelectedIndexChange); - //-- define public properties with change handlers defineProperty('focusIndex', handleFocusIndexChange, ctrl.selectedIndex || 0); defineProperty('offsetLeft', handleOffsetChange, 0); @@ -34,6 +31,7 @@ function MdTabsController ($scope, $element, $window, $timeout, $mdConstant, $md //-- define public properties ctrl.scope = $scope; + ctrl.parent = $scope.$parent; ctrl.tabs = []; ctrl.lastSelectedIndex = null; ctrl.hasFocus = false; @@ -68,12 +66,14 @@ function MdTabsController ($scope, $element, $window, $timeout, $mdConstant, $md function init () { ctrl.selectedIndex = ctrl.selectedIndex || 0; compileTemplate(); + configureWatchers(); bindEvents(); $mdTheming($element); $timeout(function () { updateHeightFromContent(); adjustOffset(); updatePagination(); + updateInkBarStyles(); ctrl.tabs[ctrl.selectedIndex] && ctrl.tabs[ctrl.selectedIndex].scope.select(); loaded = true; }); @@ -87,7 +87,7 @@ function MdTabsController ($scope, $element, $window, $timeout, $mdConstant, $md var template = $attrs.$mdTabsTemplate, element = angular.element(elements.data); element.html(template); - $compile(element.contents())(ctrl.scope); + $compile(element.contents())(ctrl.parent); delete $attrs.$mdTabsTemplate; } @@ -99,25 +99,8 @@ function MdTabsController ($scope, $element, $window, $timeout, $mdConstant, $md $scope.$on('$destroy', cleanup); } - /** - * Defines a two-way data-binding without requiring an isolated scope. - * @param key - * @param attr - * @param defaultValue - * @param handler - */ - function defineBinding (key, attr, defaultValue, handler) { - var value = defaultValue, model; - defineProperty(key, function (newValue, oldValue) { - model && model.assign && model.assign(ctrl.scope, newValue); - handler(newValue, oldValue); - }, value); - if ($attrs.hasOwnProperty(attr)) { - model = $parse($attrs[attr]); - $scope.$watch($attrs[attr], function (newValue) { - ctrl[key] = newValue || 0; - }); - } + function configureWatchers () { + $scope.$watch('$mdTabsCtrl.selectedIndex', handleSelectedIndexChange); } /** diff --git a/src/components/tabs/js/tabsDirective.js b/src/components/tabs/js/tabsDirective.js index 08a1695449b..250ae573e97 100644 --- a/src/components/tabs/js/tabsDirective.js +++ b/src/components/tabs/js/tabsDirective.js @@ -90,6 +90,9 @@ angular function MdTabs ($mdTheming, $mdUtil, $compile) { return { + scope: { + selectedIndex: '=?mdSelected', + }, template: function (element, attr) { attr["$mdTabsTemplate"] = element.html(); return '\ @@ -193,6 +196,7 @@ function MdTabs ($mdTheming, $mdUtil, $compile) { '; }, controller: 'MdTabsController', - controllerAs: '$mdTabsCtrl' + controllerAs: '$mdTabsCtrl', + bindToController: true }; }