title: Pure Pipes in Angular
body: <p>As a beginner in Angular, I came across the pure pipes which</p>
  
  <ul>
  <li>a)   Executes only when a pure change to the input value is detected.</li>
  <li>b)   A pure change is either a change to a primitive input value<br>
  (String, Number, Boolean) or a changed object reference (Array, Date,
  Function, Object).</li>
  <li>c)   A Pure pipe is not executed if the input to the pipe is an
  object and only the property values of that object changes but not
  the reference.</li>
  </ul>
  
  <p>The object reference part I am clear with and the problem lies with the primitive types. </p>
  
  <p>A crucial fact lies on optimization with pure pipe is</p>
  
  <p><strong><em>Angular is going to evaluate given pure pipe call only if it has received different arguments compared to its previous invocation.</em></strong></p>
  
  <p>I tried with an example:</p>
  
  <p><strong>applypure.pipe.ts</strong></p>
  
  <pre><code>import { Pipe, PipeTransform } from '@angular/core';
  
  @Pipe({
    name: 'applypure',
    pure: true 
  })
  export class ApplypurePipe implements PipeTransform {
    count = 0;
    constructor() {
      // To determine an instance is created
      console.log('pipe created:');
    }
  
      transform(value: number, exponent: number): number {
      //this.count++;
      console.log(value);
      return Math.pow(value, exponent);;
    }
  }
  </code></pre>
  
  <p><strong>app.component.ts</strong></p>
  
  <pre><code>import { Component } from '@angular/core';    
  
  @Component({
    selector: 'my-app',
    template: `
              {{12 | applypure : 2}}
              {{12 | applypure: 2 }}  
             `
  })
  export class AppComponent  {
    }     
  }
  </code></pre>
  
  <p>The result is shown below :</p>
  
  <p><a href="https://i.stack.imgur.com/fZewc.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/fZewc.png" alt="Result"></a></p>
  
  <p><strong>The same input is being passed to pure pipe immediately after, yet its transform method is called twice. Shouldn't it skip the re-evaluation?. Please clarify.</strong></p>