title: Angularjs custom filter and dependency injection
body: <p>I'm new to AngularJS and i see this syntax a lot:</p>
  
  <pre><code>function someFunc(){
     return function(input){
      return 'hello' + input;
    }
  }
  </code></pre>
  
  <p>The function above is a general syntax i tend to see a lot but problem is specific with this example for custom filter:</p>
  
  <pre><code>angular.module('bookFilters', [])
      .filter('newBookFilter', function(){
            return function(input){
          return 'The Book: ' + input.name + 'is new !';
     };
  });
  </code></pre>
  
  <p>I understand that wrapping the function with another function gives me an opportunity to use dependency injection, Here is my questions about it:</p>
  
  <p>Does the filter get the function returned from the wrapping function? Then is it able to use dependency injection to inject the value into the function? <strong>Theoretically that:</strong></p>
  
  <p>This code:</p>
  
  <pre><code>{{bookObj | newBookFilter}}
  </code></pre>
  
  <p>Will become:</p>
  
  <pre><code>{{   bookObj | function(input){return 'The Book: ' + input.name + 'is new !'; }  }}
  </code></pre>
  
  <p>And finally the <code>{{}}</code> will return the final value from the function.</p>
  
  <p>Why can't i just inject the <code>input</code> to the first function like:</p>
  
  <pre><code>angular.module('bookFilters', [])
           .filter('newBookFilter', function(input){
               return 'The Book: ' + input.name + 'is new !';
       });
  </code></pre>
  
  <p><strong>Why dependency injection will only work on returned function?</strong></p>
  
  <p>I know i really confused here, If anyone can help me i will be very thankful, Thank you all and have a nice day.</p>