angular-docs-cn/modules/@angular/docs/cheatsheet/lifecycle hooks.md

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.