title: Can't access parent $scope in $mdBottomSheet
body: <p>I can't access the parent ä<code>$scope</code> in my <code>$mdBottomSheet</code>. Iwant be able to create this bottom sheet and click one of the buttons inside of it displaying the parent <code>$scope</code> data. I made a <a href="https://codepen.io/end_game/pen/aqVqaB" rel="nofollow noreferrer">codepen</a>.</p>
  
  <p><strong>That's the code by the way:</strong></p>
  
  <pre><code>&lt;div ng-controller="BottomSheetExample" class="md-padding bottomSheetdemoBasicUsage" ng-cloak="" ng-app="MyApp"&gt;
  
    &lt;div class="bottom-sheet-demo inset" layout="row" layout-sm="column" layout-align="center"&gt;
  
      &lt;md-button flex="50" class="md-primary md-raised" ng-click="showGridBottomSheet()"&gt;Show as Grid&lt;/md-button&gt;
    &lt;/div&gt;
  
    &lt;div ng-if="alert"&gt;
      &lt;br&gt;
      &lt;b layout="row" layout-align="center center" class="md-padding"&gt;
        {{alert}}
      &lt;/b&gt;
    &lt;/div&gt;
  &lt;script type="text/ng-template" id="bottom-sheet-grid-template.html"&gt;&lt;md-bottom-sheet class="md-grid" layout="column" ng-cloak&gt;
    &lt;div&gt;
      &lt;md-list flex layout="row" layout-align="center center"&gt;
        &lt;md-list-item ng-repeat="item in items"&gt;
          &lt;div&gt;
          &lt;md-button class="md-grid-item-content" ng-click="listItemClick($index)"&gt;
            &lt;md-icon md-svg-src="{{item.icon}}"&gt;&lt;/md-icon&gt;
            &lt;div class="md-grid-text"&gt; {{ item.name }} &lt;/div&gt;
          &lt;/md-button&gt;
          &lt;/div&gt;
        &lt;/md-list-item&gt;
      &lt;/md-list&gt;
    &lt;/div&gt;
  &lt;/md-bottom-sheet&gt;
  &lt;/script&gt;
  
  &lt;/div&gt;
  </code></pre>
  
  <p><strong>JavaScript:</strong></p>
  
  <pre><code>angular.module('MyApp',['ngMaterial', 'ngMessages', 'material.svgAssetsCache'])
  .config(function($mdIconProvider) {
      $mdIconProvider
        .icon('share-arrow', 'img/icons/share-arrow.svg', 24)
        .icon('upload', 'img/icons/upload.svg', 24)
        .icon('copy', 'img/icons/copy.svg', 24)
        .icon('print', 'img/icons/print.svg', 24)
        .icon('hangout', 'img/icons/hangout.svg', 24)
        .icon('mail', 'img/icons/mail.svg', 24)
        .icon('message', 'img/icons/message.svg', 24)
        .icon('copy2', 'img/icons/copy2.svg', 24)
        .icon('facebook', 'img/icons/facebook.svg', 24)
        .icon('twitter', 'img/icons/twitter.svg', 24);
    })
  .controller('BottomSheetExample', function($scope, $timeout, $mdBottomSheet, $mdToast) {
    $scope.alert = '';
    $scope.items = [
      { name: 'Hangout', icon: 'hangout' },
      { name: 'Mail', icon: 'mail' },
      { name: 'Message', icon: 'message' },
      { name: 'Copy', icon: 'copy2' },
      { name: 'Facebook', icon: 'facebook' },
      { name: 'Twitter', icon: 'twitter' },
    ];
  
    $scope.listItemClick = function($index) {
      var clickedItem = $scope.items[$index];
      $mdBottomSheet.hide(clickedItem);
    };
    $scope.showGridBottomSheet = function() {
      $scope.alert = '';
      $mdBottomSheet.show({
        templateUrl: 'bottom-sheet-grid-template.html',
        controller: function () {
                        return this;
        },
        preserveScope: true,
        bindToController: true,
        clickOutsideToClose: true
      }).then(function(clickedItem) {
        $mdToast.show(
              $mdToast.simple()
                .textContent(clickedItem['name'] + ' clicked!')
                .position('top right')
                .hideDelay(1500)
            );
      });
    };
  })
  .run(function($http, $templateCache) {
  
      var urls = [
        'img/icons/share-arrow.svg',
        'img/icons/upload.svg',
        'img/icons/copy.svg',
        'img/icons/print.svg',
        'img/icons/hangout.svg',
        'img/icons/mail.svg',
        'img/icons/message.svg',
        'img/icons/copy2.svg',
        'img/icons/facebook.svg',
        'img/icons/twitter.svg'
      ];
  
      angular.forEach(urls, function(url) {
        $http.get(url, {cache: $templateCache});
      });
  
    });
  </code></pre>
  
  <p>I can't see the buttons/icons inside the sheet.</p>
  
  <p>Fiddle: <a href="https://jsfiddle.net/uvkr9zwe/" rel="nofollow noreferrer">https://jsfiddle.net/uvkr9zwe/</a></p>