Is it feasible to create a basic template editor using angularjs where an input field with an ng-model can be connected to a style tag to control the css on an entire page rather than applying it to a specific element with inline styling? Could something like this be achieved?
<!doctype html>
<html lang="en" ng-app>
<head>
<meta charset="UTF-8">
<title>Document</title>
<script src="js/angular.min.js"></script>
<style>
html, body { height:100%; margin:0; padding:0; }
div, ul, li, ol, span { margin:0; padding:0; }
</style>
</head>
<body>
<textarea type="text" ng-model="data.style" placeholder="enter style"></textarea>
</body>
</html>
<script>
window.addEventListener('load', function(){
var style = document.createElement('style');
var textnode = document.createTextNode('{{data.style}}');
style.appendChild(textnode);
document.querySelector('head').appendChild(style);
}, false)
</script>