title: Access angular template element
body: <p>I am wondering what the correct angular way to access the main html template element. I can use getelementbyid and also can access it using attr.$$element[0] but wondering if there is a cleaner way. In the example below I would like the equivalent of the getElementById line.</p>
  
  <pre><code>var app = angular.module('test', []);
  app.directive('test', function(){
    return {
      restrict: 'E',
      template: '&lt;canvas id="test-canvas"&gt;&lt;/canvas&gt;',
      replace: true,
      link: function(scope, elem, attr) {
        // what is angular way of doing this?
        var canvas = initCanvas(document.getElementById("test-canvas")),
        // this works - is this recommended method?
        var canvas = attr.$$element[0];
  
      }
    };
  });
  </code></pre>