Angular: Empty Fiddle

http://angularjs.org/

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.3.15/angular.js"></script>
<main></main>

JavaScript

'use strict';

function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError('Cannot call a class as a function'); } }

var MainController = function MainController($scope) {
  _classCallCheck(this, MainController);

  this.$scope = $scope;
  this.user = 'John';

  this.$scope.$watch('main.user', function (newVal) {
    console.log(newVal);
  });

  MainController.$inject = ['$scope'];
};

function mainDDO() {
  return {
    restrict: 'E',
    controller: MainController,
    controllerAs: 'main',
    scope: {},
    template: '<input type="text" ng-model="main.user"><p>Hello, {{main.user}}!</p>'
  };
}

angular.module('myApp', []);
angular.module('myApp').directive('main', mainDDO);