title: Angular JS - Make service globally accessible from controllers and view
body: <p>Let's say we have the following service: </p>
  
  <pre><code>myApp.factory('FooService', function () { ...
  </code></pre>
  
  <p>Then, from a controller, I would say:</p>
  
  <pre><code>myApp.controller('FooCtrl', ['$scope', 'FooService', function ($scope, FooService) { ...
  </code></pre>
  
  <p>The two-part question is:</p>
  
  <ol>
  <li><strong>Global Accessibility</strong>:  If I have 100 controllers and all need access to the service, I don't want to explicitly inject it 100 times.  <strong>How can I make the service globally available?</strong>  Only thing I can think of at the moment is wrapping it from within the root scope, which defeats the purpose.</li>
  <li><strong>Accessibility from view</strong>:  How can I access the service from within the view?  <a href="https://groups.google.com/forum/?fromgroups=#!topic/angular/H6xROj3t1H0" rel="noreferrer">This post</a> suggests wrapping the service from within the controller.  If I am going to that length, seems I ought to just implement the functionality right on the root scope?</li>
  </ol>