CODEWITHSUNDEEP
angularngonchanges
Daniel Izhar
Daniel Izhar

Reputation: 130

Angular4, Getting error f.ngOnChanges is not a function in target es5

Getting an error

f.ngOnChanges is not a function

The issue only happens if my tsconfig.json file is setup to target es5, However if my target is es6 everything works as expected.

Does anyone know how I can get ngOnChange work if my target is es5?

import {Component, ViewChild, Type, Input, Output, OnInit,OnChanges, ElementRef, EventEmitter, SimpleChanges} from '@angular/core';

@Component({
       selector: "form",
        styleUrls:['./crop.form.component.css'],
      templateUrl: './crop.form.component.html',
      })


export class CropFormComponent extends Type   {


@Input() imageFile: any;  
@Output() showUploadModal = new EventEmitter;



size: string;


// imageCropped: boolean; // imageNotCropped: boolean;



    //Cropper 2 data
    data:any;


    constructor() { }


ngOnChanges(changes: SimpleChanges): void{


}

}

tsconfig.json

    {
  "compileOnSave": false,
  "compilerOptions": {
    "outDir": "./dist/out-tsc",
    "sourceMap": true,
    "declaration": false,
    "moduleResolution": "node",
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "target": "es5",
    "typeRoots": [
      "node_modules/@types"
    ],
    "lib": [
      "es2017",
      "dom"
    ]
  }
}

Upvotes: 0

Views: 2143

Answers (1)

Martin Adámek
Martin Adámek

Reputation: 18389

You need to implement OnChanges interface to use that method:

export class CropFormComponent extends Type implements OnChanges { ... }

More about this in the docs:

https://angular.io/api/core/OnChanges

https://angular.io/guide/lifecycle-hooks#onchanges

Upvotes: 1

Related Questions