How to clear last @Input variable values ? Angular 2+

Question

I use changeDetection strategy and it works ok but when my component is destroy when I come back I have the last value saved.

Example I props 3 values to child component and went to another component when i try again to prop data i see my last values..

Example props values 1, 2 and 3. I see my last values 3. How to destoy it?

Check code and parent component:

  <div class="row"> 
   <app-poi-address [poiPin]="pinedAddress"></app-poi-address>
  </div>
 this.pinedAddress = $event;

Child component:

@Component({ 
  changeDetection: ChangeDetectionStrategy.OnPush
})
export class PoiAddressComponent implements OnInit, OnChanges {
  @Input () poiPin!: Object
  public allPin: any[] = [];
  constructor() { }

  ngOnInit(): void {
    console.log('datica' , this.poiPin);
  }

  ngOnChanges(): void {
    console.log('HelloComponent: Change Detection count = ' , this.poiPin);
    this.allPin.push(this.poiPin)
  }

}


<div *ngFor="let d of allPin  ">
    <p> {{  d?.coords?.lat }} </p>
</div>

Saved last values. I want to clear all array of allPin...

Answer 1

This would clear your all pin variable on when recreating the component after desctruction.

 ngOnInit(): void {
     allPin = [];
     console.log('datica' , this.poiPin);   
}