AngularJs & jQuery loaded htmls

You'll just need to include the angular scripts in your MVC5 app, and the proper directives to bootstrap the angular app. Then, in the html that you're loading via .load that you'd like to control with angular, start adding your functionality there via directives in your angular app or via ng-controller.

Edit

Since you can only bootstrap one angular app per document, I'd recommend putting your ng-app directive on the html or body tag of your MVC app. Per some of the other answers, this will allow your angular app to be bootstrapped immediately. The other way you could do it is wrap the section of your MVC app with a div like so:

<!-- Section Loaded with your MVC app -->
<div ng-app="testApp">
    <!-- INSERT HTML WHEN LOADED FROM JQUERY HERE -->
</div>

This would allow angular to bootstrap your app immediately.

Yes, you can have different angular controllers and templates to display content on page. You wouldn't even need the JQuery load, you could use use angular.

I think you are not initiated the Angular app.

Try this one.

var  Project = angular.module('testApp',[]);

Project.controller('testCtrl',["$scope",function($scope){
  $scope.title == "your title";

}]);

And change your html like this

< div data-ng-app="testApp" >
 < div data-ng-controller="testCtrl" > {{title}} < /div > 
< /div >

I think the issue is that, your angular.js gets loaded before it could see any ng-app, ng-controller attrs, as the HTML is loaded through jQuery.

What you may try is to manually bootstrap AngularJS after the HTML get loaded.

Add this to the callback of your jQuery HTML loading:

angular.element(document).ready(function() {
  angular.bootstrap(document, ['testApp']);
});

Please refer to this:

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