How to use controller with custom directive in AngularJS?

Question

Let's say I am using a custom directive named my-form-data:

<my-form-data info='infoObj1' template="ssc.html"/>
<my-form-data info='infoObj2' template="college.html"/>

Inside directive definition, I want a different templateUrl based on the template attribute of the directive on the HTML page.

Is there any way to specify the controller class associated with ssc.html and college.html?

Kinglish · Answer 1 · 2022-03-23T17:43:29.980

0

Use different directives. Its just a couple lines of code and they'll have their own template HTML. They can all share the same controller if desired or have their own. It doesn't make sense to try and use the same directive if you have different views and different controllers.

To answer your question directly, you can specify the controller in your directive HTML using ng-controller.

ssc.html

<div ng-controller='sscCtrl'> 
... 
</div>

college.html

<div ng-controller='collegeCtrl'> 
... 
</div>

edited Mar 23 '22 at 17:43

answered Mar 23 '22 at 17:12

Kinglish

23,358
3
22
43

1

The different directive is one way but is not an option in the above use case. I need to pass the controller the way I pass the template. – p zankat Mar 23 '22 at 17:35
I updated my answer with one possible way – Kinglish Mar 23 '22 at 17:45

How to use controller with custom directive in AngularJS?

1 Answers1