title: Using ES6 Classes as Angular 1.x directives
body: <p>I'm doing a small project to play around the goody bag the ES6 is bringing, I'm trying to set register a class as an angular directive, but I'm running into this error "TypeError: Cannot call a class as a function", but from the examples I'm finding they just write the class and register it with angular as a directive. Here's my directive.</p>
  
  <pre><code>class dateBlock {
    constructor () {
      this.template = '/app/dateblock/dateblock.html';
      this.restrict = 'AE';
      this.scope = {};
    }
  };
  
  export default dateBlock
  </code></pre>
  
  <p>and my index where I import it and then declare it.</p>
  
  <pre><code>import calendarController from './calendar/calendar.js'
  import dateBlock from './dateblock/dateblock.js'
  
  function setup($stateProvider) {
      $stateProvider
        .state('base', {
          url: '',
          controller: calendarController,
          templateUrl: '/app/calendar/calendar.html'
        });
      };
  
  setup.$inject = ['$stateProvider']
  
  var app = angular.module('calApp',['ngAnimate','ui.router','hmTouchEvents', 'templates'])
    .config(setup)
    .controller('calendarController', calendarController)
    .directive('dateBlock', dateBlock)
  </code></pre>
  
  <p>If I missed some crucial step I'd love to hear it. Also side question is it cleaner to import all the apps components to the index and register them all there or export the app and import and register within the components?</p>