En mi código, tengo una lista de cuadrícula donde el usuario puede agregar una columna deslizando un botón de alternar. El código funciona bien, pero cuando actualizo la página, la columna no está allí aunque la palanca esté abierta. Tengo que cerrar la palanca y volver a abrirla para ver la columna. Aquí está mi código, ¿qué debo corregir?

HTML:

 <mat-slide-toggle [(ngModel)]="this._materialPlan.IncludeAdditionalProduction" (change)="toggleAdditionalProduction()" class="mr-8">Ek Üretim</mat-slide-toggle>

TS:

 constructor() { this.initializeGridColumns(); } initializeGridColumns() { this.displayedColumns = [ 'Sequence', 'StockIntegrationCode', 'ReceiptName', 'PackagingTheoricYieldQuantity', 'GeoType', ]; let itemIndex = 0; if (this._materialPlan.IncludeAdditionalProduction == true) { this.displayedColumns.push("AdditionalProductionQuantity"); } else { itemIndex = this.displayedColumns.indexOf("AdditionalProductionQuantity"); if (itemIndex > 0) { this.displayedColumns.splice(itemIndex, 1); } } this.displayedColumns.push("Actions"); } toggleAdditionalProduction() { if (this._materialPlan.IncludeAdditionalProduction == true) { this.form.controls["AdditionalProductionQuantity"].clearValidators(); this.form.controls["AdditionalProductionQuantity"].updateValueAndValidity(); } else { this.form.controls["AdditionalProductionQuantity"].setValidators(Validators.required); this.form.controls["AdditionalProductionQuantity"].updateValueAndValidity(); } this.initializeGridColumns(); }