Calling controller within controller in Angular

Question

I have a popup controller:

@PopupController = ["$scope", ($scope) ->
  $scope.isActive = false

  $scope.open = ->
    $scope.isActive = true

]

And teachers controller:

@TeachersController = ["$scope", "Teacher", ($scope, Teacher) ->
  $scope.teachers = Teacher.query()

  $scope.showTeacher = ->
    # somehow call PopupController.open()

]

How to call PopupController.open() from TeachersController?

Or maybe I'm doing it wrong and Angular has some better ways to implement it?

Could you transform your Popup controller as a Popup service? — jpmorin
– jpmorin, Commented Apr 17, 2013 at 2:03
@jpmorin now the Popup controller is binded to the view with ng-controller attr. How can I bind the service in the same way? — Kir
– Kir, Commented Apr 17, 2013 at 2:10
You most likely should be using a directive instead of a controller... But that is just based on the name. Controllers shouldn't have DOM manipulation, and there should be no reason to call a controller from within a controller. A service could be a go-between, but again, if you are trying to open a pop-up on the page, a directive is what you need. — Tim Withers
– Tim Withers, Commented Apr 17, 2013 at 2:43
First of all, it is possible for two controllers to communicate with each other only if they use a common service or one is prototypal descendent of the other. But for your case, I agree with @TimWithers that the popup functionality shouldn't be viewed as a controller but a directive because it involves DOM manipulation. A good starting point is to take a look of how the AngularUI Bootstrap project implemented their Dialog and Model directives. — tamakisquare
– tamakisquare, Commented Apr 17, 2013 at 3:54
If either of the directives suites your need, you can choose to simply adopt it or implement your own directive while using their source code as reference. — tamakisquare
– tamakisquare, Commented Apr 17, 2013 at 3:55

Mark Rajcok · Accepted Answer · 2013-04-17 15:20:36Z

3

You may use $broadcast (downward to child scopes) or $emit (upward to scope hierarchy) to transmit an event form one controller to the other.

Then you would register an event on the receiver that triggers your function. See http://docs.angularjs.org/api/ng.$rootScope.Scope#$on.

edited Apr 17, 2013 at 15:20

Mark Rajcok

365k114 gold badges500 silver badges494 bronze badges

answered Apr 17, 2013 at 8:18

ocolot

7286 silver badges18 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Calling controller within controller in Angular

1 Answer 1

Comments

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Linked

Related