angularjs with Sharepoint 2013 using ajax

Question

Although it discussed here: AngularJS with Sharepoint 2010 not working And uses of timeout in order to make the page being loaded synchronous (I don't like this solution) - it's not work.

I have loaded the html of the webpart page after the angular is loaded:

window.onload = function(){
    setTimeout(function(){       
        str+='<p>Name : <input type="text" ng-model="name" placeholder="Enter 
        name here"></p>'        
        str+='<h1>Hello {{name}}</h1>'                
        str+='<button id="submit"></button>'

        document.getElementById("ngApp").innerHTML=str;    
    }, 2500);
}

The output is: "Hello {{name}}"

    <script src=".../angularjs.js"></script>
<script src=".../code.js"></script>

Answer 1

When Loading Content or Libraries Async, you have to initialize AngularJS manually, after all your content and libraries are loaded. This is called manual initialization (or sometimes manual bootstrapping):

angular.bootstrap(document, ['myApp']);

Refer to the Angular Documentation for a detailed description.