<!DOCTYPE html>
<html ng-app="simple">
<head>
<title>Simple</title>
<!-- we need jquery for e2e testing -->
<script src="../../components/jquery/jquery.js"></script>
<script src="../../components/angular-unstable/angular.js"></script>
<script src="../../angular-contenteditable.js"></script>
<script>
angular.module('simple', ['contenteditable'])
.controller('Ctrl', function($scope) {
$scope.model = "Initial stuff <b>with bold</b> <em>and italic</em> yay"
})
.controller('Ctrl2', function($scope) {})
angular.bootstrap(document, ['simple'])
</script>
</head>
<body>
<div ng-controller="Ctrl">
<label>Contenteditable (View):</label>
<div id="input" contenteditable ng-model="model">
</div>
<hr>
<div>
<label>Model:</label>
<pre id="output" onclick="console.log('clicked the output')">{{ model }}</pre>
<div ng-controller="Ctrl2">
The other controller
</body>
</html>