2.8 KiB
@cheatsheetSection Directive and component change detection and lifecycle hooks @cheatsheetIndex 9 @description {@target ts dart}(implemented as class methods){@endtarget} {@target js}(implemented as component properties){@endtarget}
@cheatsheetItem
syntax(ts):
constructor(myService: MyService, ...) { ... }
|constructor(myService: MyService, ...)
syntax(js):
constructor: function(MyService, ...) { ... }
|constructor: function(MyService, ...)
syntax(dart):
MyAppComponent(MyService myService, ...) { ... }
|MyAppComponent(MyService myService, ...)
description:
The class constructor is called before any other lifecycle hook. Use it to inject dependencies, but avoid any serious work here.
@cheatsheetItem
syntax(ts dart):
ngOnChanges(changeRecord) { ... }
|ngOnChanges(changeRecord)
syntax(js):
ngOnChanges: function(changeRecord) { ... }
|ngOnChanges: function(changeRecord)
description:
Called after every change to input properties and before processing content or child views.
@cheatsheetItem
syntax(ts dart):
ngOnInit() { ... }
|ngOnInit()
syntax(js):
ngOnInit: function() { ... }
|ngOnInit: function()
description:
Called after the constructor, initializing input properties, and the first call to ngOnChanges.
@cheatsheetItem
syntax(ts dart):
ngDoCheck() { ... }
|ngDoCheck()
syntax(js):
ngDoCheck: function() { ... }
|ngDoCheck: function()
description:
Called every time that the input properties of a component or a directive are checked. Use it to extend change detection by performing a custom check.
@cheatsheetItem
syntax(ts dart):
ngAfterContentInit() { ... }
|ngAfterContentInit()
syntax(js):
ngAfterContentInit: function() { ... }
|ngAfterContentInit: function()
description:
Called after ngOnInit when the component's or directive's content has been initialized.
@cheatsheetItem
syntax(ts dart):
ngAfterContentChecked() { ... }
|ngAfterContentChecked()
syntax(js):
ngAfterContentChecked: function() { ... }
|ngAfterContentChecked: function()
description:
Called after every check of the component's or directive's content.
@cheatsheetItem
syntax(ts dart):
ngAfterViewInit() { ... }
|ngAfterViewInit()
syntax(js):
ngAfterViewInit: function() { ... }
|ngAfterViewInit: function()
description:
Called after ngAfterContentInit when the component's view has been initialized. Applies to components only.
@cheatsheetItem
syntax(ts dart):
ngAfterViewChecked() { ... }
|ngAfterViewChecked()
syntax(js):
ngAfterViewChecked: function() { ... }
|ngAfterViewChecked: function()
description:
Called after every check of the component's view. Applies to components only.
@cheatsheetItem
syntax(ts dart):
ngOnDestroy() { ... }
|ngOnDestroy()
syntax(js):
ngOnDestroy: function() { ... }
|ngOnDestroy: function()
description:
Called once, before the instance is destroyed.