angular-skyhook
angular-skyhook copied to clipboard
skyhook-preview: binding style template via async pipe causes unnecessary change detection
https://github.com/cormacrelf/angular-skyhook/blob/f3ab68468551b469ffa33622727e6e64eb8dc929/packages/multi-backend/src/preview-renderer.component.ts#L21
Recommend writing directly to the dom and calling change detection manually in or after hover callback:
constructor(private skyhook: SkyhookDndService, private _el: ElementRef) {
this.sub = this.style$.subscribe((style) => {
requestAnimationFrame_or_equivalent(() => {
this._el.nativeElement.style = `transform: ${style.transform}; display: ${style.display}`;
});
});
}
I confirm the problem, and I've found similar error in the example of the skyhook/sortable. Disabling Ivy seems fixing the issue. https://github.com/cormacrelf/angular-skyhook/blob/4c4cb8d1392e1681be4093c95e1ebdd2d4455e23/packages/examples/src/app/sortable/simple/simple.component.html#L22
<div class="priority"
[ssRender]="context"
#render="ssRender"
[class.priority--placeholder]="render.isDragging$|async"