Angular 组件：扩展 class 的实例似乎被覆盖

Question

In my angular 8 project I have a class (just a class, not implemented as a component) that provides some default configuration and methods.

This class gets extended by multiple components. If multiple components on the same view (ie that exist at the same time) extend that class their instances seem to overwrite each other. If I overwrite an attribute or a method in 1 of the components and another one gets instantiated afterwards, the overwrites vanish.

I have no idea why that would happen. The constructor of the extended class gets called multiple times, so in theory, every extending class should create its own instance.

Update

I recreated the problem in this StackBlitz demo: https://stackblitz.com/edit/angular-hw1cv9

Both ListComponent and PopupComponent extend DataGridComponent. In ListComponent I enable the export functionality in the template and that always works. I also overwrite the onExporting event handler. This overwrite works fine if you comment out the popup (or block it from being created with *ngIf="popupVisible") but it reverts to its original functionality with the popup as is.

(I can't figure out how to show devextreme icons in the demo, sorry. The export button is the left one above the table).

Updated the demo with the solution

Answer 1

You're setting the defaultOptions of the DataGrid Object itself. Any Class that inherits your Component or imports the DataGrid from somewhere else will the the config you've set within the DataGridComponents constructor.

Are you sure you directly want to assign the defaultOptions to the DataGrid Object?