How to load AngularJS fully encapsulated

An example of how you might load an AngularJS application fully encapsulated into a single custom directive.

by Michael Perrenoud

HTML

<body>
<h1>The Directive</h1>
<hello-mike ng-app="app">
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.3/angular.min.js"></script>

    <script>
        angular.module('app', [])
                .directive('helloMike', function () {
                    return {
                        restrict: 'E',
                        template: '<input type="text" ng-model="name"><p>Hello, {{name}}!</p>'
                    }
                })
    </script>
</hello-mike>
</body>