Angular2 AfterViewChecked not firing on a directive when binding is complete on RC4

左心房为你撑大大i 提交于 2020-08-25 04:00:28

问题


I have an Angular 2 directive that makes the header (th) of a given table to remain fixed when the table is placed within a scrollable div. It resizes the column headers according to the size of the data on the cells, and vice-versa. It was working fine until Angular 2 RC1, but after I upgraded it to RC4 it stopped working.

After a while I realized that the number of "AfterViewChecked" events triggered by the framework has been reduced, probably due to an issue that got fixed. The problem now is that my directive is no longer triggering its recalculation logic to resize the table headers.

Is it possible to bind or capture an event from the parent's directive table in order to trigger the recalculation process?

The directive code is more or less like this:

export class TableFixedHeaderDirective implements AfterViewChecked, AfterViewInit
...
ngAfterViewInit(): void ...
ngAfterViewChecked(): void ...
onWindowResize(): void ...
...

Within these events is where I call the logic to perform the header calculation, which will basically resize either headers or columns, depending on the width of the data being displayed.


回答1:


An angular directive does not have a View so all of the view related lifecycle hooks will not work, since they don't exist.

See the docs

Directives and Components

ngOnInit
Initialize the directive/component after Angular initializes the data-bound input properties.

ngOnChanges Respond after Angular sets a data-bound input property. The method receives a changes object of current and previous values.

ngDoCheck
Detect and act upon changes that Angular can or won't detect on its own. Called every change detection run.

ngOnDestroy Cleanup just before Angular destroys the directive/component. Unsubscribe observables and detach event handlers to avoid memory leaks.

Components only

ngAfterContentInit
After Angular projects external content into its view.

ngAfterContentChecked
After Angular checks the bindings of the external content that it projected into its view.

ngAfterViewInit After Angular creates the component's view(s).

ngAfterViewChecked
After Angular checks the bindings of the component's view(s).



来源:https://stackoverflow.com/questions/38490261/angular2-afterviewchecked-not-firing-on-a-directive-when-binding-is-complete-on

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!