title: What is the purpose of square bracket usage in Angular?
body: <p>I would like to understand the difference between the declaration of <code>MyOtherService</code> and <code>MyOtherComplexService</code>. Especially what is the purpose of square bracket part? When to use them and when not?</p>
  
  <pre class="lang-js prettyprint-override"><code>var myapp = angular.module('myapp', []);
  
  myapp.factory('MyService', function($rootScope, $timeout) {
      return {
          foo: function() {
              return "MyService";
          }
      }
  });
  
  myapp.factory('MyOtherService', function($rootScope, $timeout, MyService) {
      return {
          foo: function() {
              return "MyOtherService";
          }
      }
  });
  
  myapp.factory('MyOtherComplexService', ['$rootScope', '$timeout', 'MyService', function($rootScope, $timeout, MyService) {
      return {
          foo: function() {
              return "MyOtherComplexService";
          }
      } 
  }]);
  
  myapp.controller('MyController', function($scope, MyOtherService, MyOtherComplexService) {
  
      $scope.x = MyOtherService.foo();
      $scope.y = MyOtherComplexService.foo(); 
  });
  </code></pre>