Attach Controller to $http html data?

Question

What I want to do is to load separated templates and append a controller to each one:

an approach:

$http({
    method: 'GET',
    url: 'templates/myTemplate.html',
    controller:'myCtrl'
})

function myCtrl($scope){
    $scope.var1= "scoped variable";
}

myTemplate.html:

A Tag

that is an aproach to this question: Loading an AngularJS controller dynamically

Could you clarify your question and explain what you are trying to achieve? Give an example of the expected result if possible. — Galdo, Aug 15 '13 at 23:09
You can add the ng-controller directive to any element once it's part of the DOM. — Sharondio, Aug 16 '13 at 00:01

jandersen · Accepted Answer · 2013-08-16T01:01:04.737

It appears that your scenario would be a good place to apply ng-include. For example, given this markup:

<div ng-controller="MainCtrl">
    <div ng-include="template"/>
</div>

and this code in MainCtrl:

function MainCtrl($scope) {
  // some logic that would determine the template you want to load
  $scope.template = 'templates/myTemplate.html';
}

and this code in templates/myTemplate.html:

<div ng-controller="TemplateCtrl">
     <!-- Template Content -->
</div>

angular will automatically download templates/myTemplate.html and apply TemplateCtrl to the template. (Of course you'd also need to have TemplateCtrl defined.) When you want to switch templates, in MainCtrl you'll need to change the value of $scope.template to another template url; that template would specify an ng-controller attribute that indicates the appropriate controller for that template.

Great!, I guess this is the way to go! – Uuid Aug 16 '13 at 05:07 — Uuid, Aug 16 '13 at 05:07

Attach Controller to $http html data?

1 Answers1