AngularJS. How to call controller function from outside of controller component

by

Here is a way to call controller’s function from outside of it: 

angular.element(document.getElementById('yourControllerElementID')).scope().get();

where get() is a function from your controller.

You can switch 

document.getElementById('yourControllerElementID')`

to 

$('#yourControllerElementID')

If you are using jQuery.

Also, if your function means changing anything on your View, you should call 

angular.element(document.getElementById('yourControllerElementID')).scope().$apply();

to apply the changes.

One more thing, you should note is that scopes are initialized after the page is loaded, so calling methods from outside of scope should always be done after the page is loaded. Else you will not get to the scope at all.

UPDATE:

With the latest versions of angular, you should use

angular.element(document.getElementById('yourControllerElementID')).injector().‌​get('$rootScope')

And yes, this is, in fact, a bad practice, but sometimes you just need things done quick and dirty.

More Related Contents:

  1. How to set focus on input field?
  2. Removing the fragment identifier from AngularJS urls (# symbol)
  3. Reloading the page gives wrong GET request with AngularJS HTML5 mode
  4. How do you use $sce.trustAsHtml(string) to replicate ng-bind-html-unsafe in Angular 1.2+
  5. AngularJS ui router passing data between states without URL
  6. Cache an HTTP ‘Get’ service response in AngularJS?
  7. How to format date in angularjs
  8. Use of ng-src vs src
  9. AngularJS Paging with $location.path but no ngView reload
  10. Angularjs loading screen on ajax request
  11. AngularJS UI Router – change url without reloading state
  12. Descending order by date filter in AngularJs
  13. angular.js link behaviour – disable deep linking for specific URLs
  14. Can I inject a service into a directive in AngularJS?
  15. Otherwise on StateProvider
  16. AngularJS ng-options create range
  17. How can I check which version of Angular I’m using?
  18. angular.min.js.map not found, what is it exactly?
  19. How do I sequentially chain promises with angularjs $q?
  20. Mongo Giving ‘duplicate key error’ on non-unique fields
  21. Using ng-repeat to generate select options (with Demo)
  22. How do I increase modal width in Angular UI Bootstrap?
  23. Display number always with 2 decimal places in
  24. Run a controller function whenever a view is opened/shown
  25. Pass form to directive
  26. validate natural input number with ngpattern
  27. Alternative to ng-show/-hide or how to load only relevant section of DOM
  28. Use filter on ng-options to change the value displayed
  29. Why form undefined inside ng-include when checking $pristine or $setDirty()?
  30. How to use owl-carousel in Angular2?

Leave a Comment