Sharing a variable between controllers in angular.js

by

Use a service and inject it to both controllers and refer your scope vars to the services variable.

Example: 

angular.module("yourAppName", []).factory("myService", function(){

  return {sharedObject: {data: null } }

});

function MainCtrl($scope, myService) {
  $scope.myVar = myService.sharedObject;
}

function SearchCtrl($scope, $http, myService) {
  $scope.myVar = myService.sharedObject;
}

In your template do:

{{myVar.data}}

See an example Uses Angular v1.1.5

The reason you put it in an inner object is to preserve your references, if you keep it without a “sharedObject”, and change that object, your binding will be pointing to the old reference and wouldn’t show anything in the template.

More Related Contents:

  1. How can I post data as form data instead of a request payload?
  2. $http.get is not allowed by Access-Control-Allow-Origin but $.ajax is
  3. Preview Image before uploading Angularjs
  4. HTML5 Video is not working with AngularJS ng-src tag
  5. Request Monitoring in Chrome
  6. What is the motivation behind the introduction of preflight CORS requests?
  7. Global variables in AngularJS
  8. jQuery Upload Progress and AJAX file upload
  9. jQuery send string as POST parameters
  10. How to use Simple Ajax Beginform in Asp.net MVC 4? [closed]
  11. Easiest way to retrieve cross-browser XmlHttpRequest
  12. Why use AJAX when WebSockets is available?
  13. Call jQuery Ajax Request Each X Minutes
  14. Google Chrome –allow-file-access-from-files disabled for Chrome Beta 8
  15. Why the cross-domain Ajax is a security concern?
  16. ASP.NET MVC Ajax.ActionLink with Image
  17. How to write javascript in client side to receive and parse `chunked` response in time?
  18. $.ajax call working fine in IE8 and Doesn’t work in firefox and chrome browsers
  19. Form submit in conditionally rendered component is not processed
  20. Set-Cookie on Browser with Ajax Request via CORS
  21. jQuery mobile $(document).ready equivalent
  22. Setting processData to false in jQuery breaks my AJAX request
  23. Detecting AJAX requests on NodeJS with Express
  24. CORS error for application running from file:// scheme
  25. In javascript, how can I uniquely identify one browser window from another which are under the same cookiedbased sessionId
  26. How to hide ajax requests from firebug console?
  27. Using the HTTP Range Header with a range specifier other than bytes?
  28. Render multiple components with f:ajax
  29. How to Implement ajax pagination with will_paginate gem
  30. Selenium WebDriver – determine if element is clickable (i.e. not obscured by dojo modal lightbox)

Leave a Comment