fix(panel): element not being removed when scope is destroyed (#9567)

The panel element wasn't being removed when it's scope is destroyed (e.g. when navigating to a different page).

Fixes #8683.

Author: crisbeto

src/components/panel/panel.js

@@ -817,6 +817,7 @@ MdPanelService.prototype.create = function(config) {
 
   var panelRef = new MdPanelRef(this._config, this._$injector);
   this._trackedPanels[config.id] = panelRef;
+  this._config.scope.$on('$destroy', angular.bind(panelRef, panelRef.detach));
 
   return panelRef;
 };

src/components/panel/panel.spec.js

@@ -114,6 +114,16 @@ describe('$mdPanel', function() {
     expect(PANEL_EL).not.toExist();
   });
 
+  it('should remove a panel from the DOM when the scope is destroyed', function() {
+    openPanel();
+
+    expect(PANEL_EL).toExist();
+
+    panelRef.config.scope.$destroy();
+
+    expect(PANEL_EL).not.toExist();
+  });
+
   it('should hide and show a panel in the DOM', function() {
     openPanel(DEFAULT_CONFIG);