Manual Angular Bootstrap Example

Shows how to wire up Angular "after the fact."

by Jeremy Likness

HTML

<div id="myApp">Initializing...</div>
<script type="text/template" id="myTemplate">
    <div ng-controller="myController">
    <input type="text" ng-model="model"/>
    {{model}}
        <button ng-click="reset()">Reset</button>
    </div>
</script>

JavaScript

var app = angular.module("myApp", []);
app.controller("myController", function($scope) {
    $scope.model = '';
    $scope.reset = function() {
        $scope.model = '';
    };
});
angular.element(document).ready(function() {
    var template = document.getElementById("myTemplate");
    var appDiv = document.getElementById("myApp");
    setTimeout(function() {
        appDiv.innerHTML = template.innerHTML;
        angular.bootstrap(angular.element(appDiv), ['myApp']);
    }, 1000);
});