angularjs - generate dynamic html on ng click -

I want to include the dynamic HTML element with ng-bind and directive ng-click. HTML looks like this

  & lt; Body data-ng-controller = "controller" & gt; & Lt; Div id = "toolbox" & gt; & Lt; Label & gt; Page Width & lt; / Labels & gt; & Lt; Input type = "text" data-ng-model = "pagewidth" /> & Lt; Input type = "button" value = "h1" data-ng-click = "createH1 ()" /> & Lt; / Div & gt; & Lt; Div id = "editor" & gt; & Lt; Div data-ng-style = "{width: pageWidth + 'px'}" data-ng-page & gt; & Lt; / Div & gt; & Lt; / Div & gt; & Lt; / Body & gt;  

Controller>

  app.controller ('Controller', ['$ scope', function ($ scope) {$ scope.createH1 = function) {Document.getElementById ("Page"). InnerHTML = document.getElementById ("Page"). Inner HTML + ("& lt; div class = 'h1' data-ng-h1 dragbable & gt; & lt; / div & gt;);};}]);  

The above controller is inserting the html element, but instructions for the new html elements are not working.

However I found out that as long as we compile $ template / html they will not work.
If I add an app directive (ngpages, ..) to add my dynamic HTML , Then it is inserted at the start of the app. But I just want to insert the button on ng-click.

I am new to angular JS, help me with a little confused with this. thank you in advanced.

I always like to manipulate the dome from the director. Then the code here will appear below

HTML

& amp; Body ng-controller = "MainCtrl as vm" & gt; & Lt; Button add-html & gt; Click me & lt; / Button & gt; & Lt; Div id = "page" & gt; This is the text & lt; / Div & gt; Will be replaced by & lt; / Body & gt;

code

  app.directive ('addHtml', function ($ compilation) {return {restricted: 'AE' , Link: function (scope, element, etter) {var html = `` div class = 'h1' data-ng-h1 dragbable & gt; test & lt; / div & gt; `, compiled element = $ Compile (scope) element ;on ('click', function) {var pageElement = angular.element (document.getElementById ("Page"); pageElement.empty () Page Element.append (compiledElement); })}}}});  

here