remove element form service so we can have more than 1 tree

Author: Ben Rubin

src/js/branch.js

@@ -23,6 +23,8 @@ var BRANCH_ARROW_TEMPLATE = angular.element('<div class="md-branch-icon-containe
 
 /*@ngInject*/
 function branchDirective($parse, $document, $mdUtil, $filter, $$mdTree, $mdConstant) {
+  var treeElement;
+
   return {
     restrict: 'E',
     require: ['?^mdBranchTemplates'],
@@ -407,7 +409,7 @@ function branchDirective($parse, $document, $mdUtil, $filter, $$mdTree, $mdConst
           var arrow = $$mdTree.getArrow(branchElement);
           if (arrow && !$$mdTree.isTip(branchElement)) {
             // open branch by simulating click
-            $$mdTree.getTreeElement().triggerHandler({
+            getTreeElement(branchElement).triggerHandler({
               type: 'click',
               target: arrow
             });
@@ -425,7 +427,7 @@ function branchDirective($parse, $document, $mdUtil, $filter, $$mdTree, $mdConst
           var arrow = $$mdTree.getArrow(branchElement);
           if (arrow) {
             // close branch by simulating click
-            $$mdTree.getTreeElement().triggerHandler({
+            getTreeElement(branchElement).triggerHandler({
               type: 'click',
               target: arrow
             });
@@ -453,7 +455,7 @@ function branchDirective($parse, $document, $mdUtil, $filter, $$mdTree, $mdConst
       function toggleOpen(branchElement) {
         if ($$mdTree.canOpen(branchElement) && !$$mdTree.isTip(branchElement)) {
           // open branch by simulating click
-          $$mdTree.getTreeElement().triggerHandler({
+          getTreeElement(branchElement).triggerHandler({
             type: 'click',
             target: $$mdTree.getArrow(branchElement)
           });
@@ -468,13 +470,29 @@ function branchDirective($parse, $document, $mdUtil, $filter, $$mdTree, $mdConst
           el = $$mdTree.getCheckbox(branchElement);
         }
         if (el) {
-          $$mdTree.getTreeElement().triggerHandler({
+          getTreeElement(branchElement).triggerHandler({
             type: 'click',
             target: el
           });
         }
       }
 
+
+      function getTreeElement(branchElement) {
+        if (treeElement) { return treeElement; }
+        treeElement = walkForTree(branchElement);
+        return treeElement;
+      }
+
+      function walkForTree(el) {
+        var parent = el.parentNode;
+        while (parent && parent !== document.body) {
+          if (parent.nodeName === 'MD-TREE') { return angular.element(parent); }
+          parent = parent.parentNode;
+        }
+        return null;
+      }
+
     };
   }
 

src/js/service.js

@@ -4,8 +4,6 @@ angular
 
 
 function treeService($mdUtil, $animateCss) {
-  var treeCtrl;
-  var treeElement;
   // track shift pressed
   var shiftPressed = false;
   document.addEventListener('keydown', function (e) {
@@ -16,13 +14,11 @@ function treeService($mdUtil, $animateCss) {
   });
 
   return {
-    init: init,
     open: open,
     close: close,
     canOpen: canOpen,
     filterOpen: filterOpen,
     filterClose: filterClose,
-    getTreeCtrl: getTreeCtrl,
     getTreeElement: getTreeElement,
     getBranch: getBranch,
     getArrow: getArrow,
@@ -37,15 +33,6 @@ function treeService($mdUtil, $animateCss) {
     getCheckbox: getCheckbox
   };
 
-  function init(_treeCtrl, _treeElement) {
-    treeCtrl = _treeCtrl;
-    treeElement = _treeElement;
-  }
-
-  function getTreeCtrl() {
-    return treeCtrl;
-  }
-
   function getTreeElement() {
     return treeElement;
   }

src/js/tree.js

@@ -38,7 +38,6 @@ function treeDirective($mdTheming, $mdUtil) {
     vm.selected = {};
     vm.opened = {};
     vm.init = init;
-    $$mdTree.init(vm, $element); //make tree accesable to branch, via service
 
     // setup ngModel and make it available to controller
     function init(ngModel, binding) {