title: Properly use custom angularjs service, function not defined error
body: <p>I created my own service for some util methods. The idea was to simply inject the utilsservice into the modules where I need the methods. The Problem is I get an ReferrenceError: myFunction is not defined.</p>
  
  <p>I think it has to do with the wrong injecting of the service, but i can't figute out myself what's wrong with my approach.</p>
  
  <p>The service i made:</p>
  
  <pre><code>angular.module('utils',[]).service('UtilsService',function(){
  
      this.myFunction = function(){};  
  
  });
  </code></pre>
  
  <p>In my app.js file i have following structure:</p>
  
  <pre><code>(function(){
      angular.module('utils',[]);
      angular.module('translation',[]);
  
      var app = angular.module('myApp',['translation','utils']);
      app.controller('myController',['$http',function($http,UtilsService){
  
          UtilsService.myFunction();
  
      }]);
  });
  </code></pre>
  
  <p>The order I included the scripts in my .html file:</p>
  
  <pre><code>&lt;script type="text/javascript" src="../Libraries/angular.min.js"&gt;&lt;/script&gt;
  &lt;script type="text/javascript" src="../js/angular-js/services/utilService.js"&gt;&lt;/script&gt;
  &lt;script type="text/javascript" src="../js/angular-js/app.js"&gt;&lt;/script&gt;
  &lt;script type="text/javascript" src="../js/angular-js/translate.js"&gt;&lt;/script&gt;
  </code></pre>
  
  <p>I already tried to change the order but it doesn't make any difference.</p>
  
  <p>I am thankfull for any advice you may have!</p>