title: AngularJS calling service function via view
body: <p>I'm working with Angular(1.x) and just encountered a strange behaviour (which I do not exclude being a result of my code).</p>
  
  <p>Here is the setup:</p>
  
  <pre><code>var module = angular.module('module_name');
  
  module.service('service_name', function() {
      this.function_name = function() { ... }
  });
  
  module.controller('controller_name', ['$scope', 'service_name',
      function($scope, service_name) {
  
          $scope.function_name = function() { ... }
  }])
  </code></pre>
  
  <p>And in the view :</p>
  
  <pre><code>&lt;div ng-controller='controller_name'&gt;
      &lt;button ng-click="function_name()"&gt;Test&lt;/button&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>The function in service_name is accessible in the controller via <strong>service_name.function_name()</strong> as expected. But here is the strange behaviour, (once again it occurs in a more complex setting, not saying this portion of code will reproduce the described scenario)</p>
  
  <p>When clicking the button in the view the function called is not the <strong>function_name from the controller</strong> but the <strong>function_name from the service</strong>.</p>
  
  <p>Eventhough they have the same name how can the view access a function directly in the service, shouldn't it be limited to its controller scope ?</p>