title: How to access attributes within Angularjs's v1.5 component?
body: <p>I am using the v1.5 component, which is essentially (as far as my understanding extends) a wrapper for best practice directives. </p>
  
  <p>More info about the 1.5 release of component can be found here: <a href="http://toddmotto.com/exploring-the-angular-1-5-component-method/" rel="noreferrer">http://toddmotto.com/exploring-the-angular-1-5-component-method/</a></p>
  
  <p>I have the following:</p>
  
  <pre><code>&lt;span&gt;Correclty showing: {{ data.type }}&lt;/span&gt;
  &lt;book class="details" type="data.type"&gt;&lt;/book&gt;
  </code></pre>
  
  <p>And it's component definition:</p>
  
  <pre><code>angular
  .module('app')
  .component('book', {
      bindings: {
          type: '='
      },
      template: function($element, $attrs) {
          // Have tried A):
          // console.log($attrs.type); // &lt;- undefined
  
          // And B):
          $attrs.$observe('type', function(value) {
              console.log(value); // &lt;- undefined
          });
  
          // But.. C):
          return "This works though {{ book.type }}"; // &lt;- renders
      }
  });
  </code></pre>
  
  <p>Both <code>A)</code> and <code>B)</code> variations return <code>undefined</code>. <code>C)</code> renders correctly.</p>
  
  <p>Is there a way to access attributes within the template function before returning the template string?</p>