title: How to instantiate a canvas in a dialog?
body: <p>I would like to instantiate a canvas available in a dialog but it always returns a null object. In my JavaScript file I have :</p>
  
  <pre><code>     $scope.showAdvanced = function(ev) {
          var useFullScreen = ($mdMedia('sm') || $mdMedia('xs'))  &amp;&amp; $scope.customFullscreen;
          var myDialog = $mdDialog.show({
              controller: DialogController,
              templateUrl: '../templates/dialogCanvas.html',
              parent: angular.element(document.body),
              targetEvent: ev,
              clickOutsideToClose:true,
              fullscreen: useFullScreen,
          })
                  .then(function(answer) {
                      $scope.status = 'You said the information was "' + answer + '".';
          }, function() {
              $scope.status = 'You cancelled the dialog.';
          });
          $scope.$watch(function() {
              return $mdMedia('xs') || $mdMedia('sm');
          }, function(wantsFullScreen) {
              $scope.customFullscreen = (wantsFullScreen === true);
          });
      };
  </code></pre>
  
  <p>In my HTML file (dialogCanvas.html), I have this tag :</p>
  
  <pre><code>&lt;div id="back"&gt;
      &lt;canvas id="canvasZone"&gt;&lt;/canvas&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>And finally in the controller function I try to instantiate the canvas by doing this :</p>
  
  <pre><code>    function DialogController($scope, $mdDialog) {
          var canvas = document.getElementById('canvasZone');
      }
  </code></pre>
  
  <p>But the object is null.</p>