Loading angularjs dynamically and generating controllers and scope

Question

I want to use angular in an app except that angular is not loaded by default with the app. When a particular button is clicked, a new div is created and I want to use angular on that div.

I'm loading angular using yepnode as shown in the code below:

yepnope({
    test:window.angular,nope: ['/filesystem/content/js/angular.js'],
    complete: function(){ console.log('complete');}
});

Given that I've loaded angular and I have access to the div as $div, my next action will be

1. Create some html and use it as the innerHTML of $div
2. Create a controller (from another file eg /filesystem/controllers/abc.js
3. bind $div to controller and scope.

Not really sure how to proceed since in all my examples, I started with a page with angular loaded at started together with putting the ng-app tag on the html.

After loading angularjs, what are the next steps?

Thank you.

Answer 1

Angularjs guide page would help you.

http://docs.angularjs.org/guide/bootstrap

There is a description how to do the manual bootstrapping.