0

First, I say that did read Vojta's answer on similar question: Can one controller call another? but still have some things to clear.

What I need to do, is to write a controller (?) which opens a ui-bootstrap modal window (http://angular-ui.github.io/bootstrap/#/modal).

This popup can be opened from different pages, so I want this code to be in a separate shelter. The problem is, that this controller doesn't have view (that can trigger it to run), neither it has dedicated state (I use ui-router).

So I would want to write something like this

<div ng-click="angular.module('app').controller('popup').run();">

but of course, it's not going to happen.

I think service can be involved for that purpose, but I believe it's no good idea to use services for things which deal with user interaction. I believe controllers were designed for that.

Other option is to use a directive (which is supposed to deal with views by design), but what if I want to activate this directive from logic?

Please clarify how to properly deal with that kind of things. Thanks!

Community
  • 1
  • 1
mike.shestakov
  • 413
  • 3
  • 14

1 Answers1

0

I think popup is a directive. If you want to use that programatically you could insert the directive in a parent element and activate it referencing $rootScope.

If you really need to insert the directive at runtime inside a controller you could do something like this.

//assume you have a <popup> directive
var popup = angular.element(document.createElement('popup'));
var el = $compile( popup )( $scope );
//where do you want to place the new element?
angular.element(document.body).append(popup);

This way you can access popup.myMethod (or el.myMethod, i'm not sure) from the controller.

Bolza
  • 1,904
  • 2
  • 17
  • 42
  • I want to use ui-bootstrap's popup var modalInstance = $modal.open({ templateUrl: 'myModalContent.html', controller: ModalInstanceCtrl, size: size, resolve: { items: function () { return $scope.items; } } }); I might be wrong, but I think involving a directive to simply call plugin method is a little too much/ Correct me if Im wrong. – mike.shestakov Jul 10 '14 at 12:37
  • link above doesn't work. http://angular-ui.github.io/bootstrap/ and than click directives -> modal to see what I'm up to. – mike.shestakov Jul 10 '14 at 12:41
  • i see that modalInstance.open() does work. So if you want a modal just make a new one inside the controller like is done in the ui.bootstrap example and call the method.. PS: Or you just want to create the modal without actually show it? – Bolza Jul 10 '14 at 12:50
  • my popup has some logic (load/edit/save settings) and configuration (template, size etc), to it's not about simply calling method. I want to wrap all that code into something, so I can reuse it later. – mike.shestakov Jul 10 '14 at 12:53
  • It doesn't seem that ui.bootstrap popup can be instanced without being opened :( – Bolza Jul 10 '14 at 13:45
  • of course no, but I don't need it. I need a shelter to put that code into (conf + logic + open modal). It could have been a controller which opens popup when it runs, but one doesn't simply run controller without ng-controller in view or router. So I need something else, and that's what I'm asking for... – mike.shestakov Jul 10 '14 at 13:51
  • That's why i would use a directive that wraps $modal.open and the other methods. It's not so far from the Angular philosophy, the real issue is that the ui.bootstrap utilities are very closed and not so extendible. – Bolza Jul 10 '14 at 14:14