I want to insert HTML coming from a JS function, which is executed when the body is loaded. Initially the body is empty.
This HTML has AngularJS commands, but the problem is that AngularJS doesn't parse the HTML.
<!doctype html>
<html ng-app>
<head>
<script>
function loadHTML(){
html = '<ul ng-controller="phoneCtrl"><li ng-repeat="phone in phones">{{phone.name}}<p>{{phone.snippet}}</p></li></ul><script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.0.3/angular.min.js"></script'+'><script src="controllers.js"></script'+'>';
document.write = html;
}
</script>
</head>
<body onload="loadHTML();" ></body>
</html>
The content of controller.js is:
function phoneCtrl($scope) {
$scope.phones = [
{
"name": "Nexus S",
"snippet": "Fast just got faster with Nexus S."
},
{
"name": "Motorola XOOM™ with Wi-Fi",
"snippet": "The Next, Next Generation tablet."
},
{
"name": "MOTOROLA XOOM™",
"snippet": "The Next, Next Generation tablet."
}
];
}
