We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. (Last updated on: November 16, 2018).
Unfortunately, activation email could not send to your email. Please try again.
Syncfusion Feedback

How to open dialog from another controller function using angular js

Platform: JavaScript |
Control: ejDialog |
Published Date: July 29, 2016 |
Last Revised Date: July 29, 2016
Tags: dialog, angular


When there is two different ng-controller one with a Dialog component and the other controller to open the dialog explicitly. To open the Dialog from other controller, we need to use ‘ng-include’ directive, ‘$includeContentLoaded’ event and ‘$broadcast’ service.


  1. Create a ng-controller for rendering ejDialog control with angular binding.


  1. Create another ng-controller with angular binding and using “ng-include” directive add the “basigDialog.html”(File name of the other controller). Please refer the following code snippet.
  1. Now to check whether any external resources added, bind $includeContentLoaded event that is emitted every time a component is included to the controller. Define script to initialize dialog control in it.
  2. Using $broadcast service bind the event for the child controllers. So that you can open the Dialog from this controller.



In the above sample, we have 2 controllers separately and initiated control from controller by referring the external resource. Find the sample from the below,


Sample link

You must log in to leave a comment

Please sign in to access our KB

This page will automatically be redirected to the sign-in page in 10 seconds.

Warning Icon You are using an outdated version of Internet Explorer that may not display all features of this and other websites. Upgrade to Internet Explorer 8 or newer for a better experience.Close Icon