Onchanges Angular4 not working

1
votes

i have the code working onInit but not onChanges.

here is code from component

import { Component, Input, OnInit, OnChanges, SimpleChanges } from '@angular/core';

export class FetchDataComponent implements OnChanges  {
 site: string[] = [];
 @Input() values: string = "https://angular.io";    

 onEnter(value: string) { this.values = value; } // this is to get value from input field

ngOnChanges(changes: SimpleChanges) {

 var slog = this.values;

 this._httpService.get('/api/websites/?angular='+slog).subscribe(values => {
            this.site= values.json() as string[];
        });
}

i tried to follow the guide https://www.concretepage.com/angular-2/angular-2-4-onchanges-simplechanges-example which is targeting angular 4.

the same code was working with onInit but i need it to monitor the changes made onChanges

2
angular
Can you add the code where you change the inputs of this component? - Lahiru Chandima
So you meant to say that ngOnChanges() is not firing? Did you try adding console.log() and checked? - Amit Chigadani

2 Answers

0
votes

when data-bound changes on the input properties on the component the angular life cycle hook method like ngOnChanges will called automatically.

Please check these stackblitz URL https://stackblitz.com/edit/angular-hpshn4?file=src%2Fapp%2Femployee%2Femployee.component.ts

changes on the input property and see the console how ngOnChanges will called

-1
votes

here is an example this might help you

component.html

<select placeholder="A" (selectionChange)="appslctchange($event)">

component.ts

 appslctchange(changeEvent) 
         {
          alert("It Works");
         }