Welcome to the Angular feedback portal. We’re happy you’re here! If you have feedback on how to improve the Angular, we’d love to hear it!

  • Check out the features or bugs others have reported and vote on your favorites. Feedback will be prioritized based on popularity.
  • If you have feedback that’s not listed yet, submit your own.

Thanks for joining our community and helping improve Syncfusion products!

1
Vote

When using a custom template (for angular, ng-template) in your Treeview control, viewContainers are not cleared when a new datasource is set.

Here is a link to your "Angular template compiler" used for creating new nodes using custom templates.

But here you are simply clearing your innerHTML of your ejs-treeview before you generate new nodes. This will cause an issue with templates containing components with subscriptions, as these will never have the ngOnDestroy callback function called.


Our solution (a temporary one..)  to this problem was to create a new directive and apply it to the ng-template with #nodeTemplate. Then on new datasource reference, access the viewContainerRef (like you do here) and call "clear()".

@Directive({
selector: '[teardown]'
})
export class TeardownNodeViewDirective {

@Input('teardown') public set onTeardown(value: any) {
constcontainer = this.viewContainer;
if (container && value != null) {
container.clear();
}
}

private get viewContainer(): ViewContainerRef {
return this.element
&& this.element.nativeElement
&& this.element.nativeElement._viewContainerRef;
}

constructor (private element: ElementRef) {}

}


<ng-template #nodeTemplate [teardown]="dataService.treeViewFields" let-data>


This is a big issue if you (like we did) implement a search feature, and bind treeviewFields model multiple times (which you have to..).


Implementation of viewContainerRef.clear() is missing and is required to prevent massive changeDetection issues.