I'm testing the tabssets of ng-bootstrap and I have this structure in the html.
<ngb-tabset>
<ngb-tab title="Simple">
<ng-template ngbTabContent>
<lamb-form-print-document
[entities]="entities"
[departments]="departments"
[voucherTypes]="voucherTypes"
[dataInit]="printDocumentDataInit"
[titleLegend]="titleLegend"
(onChangeEntity)="onChangeEntity($event)"
></lamb-form-print-document>
</ng-template>
</ngb-tab>
<ngb-tab>
<ng-template ngbTabTitle><b>Fancy</b> title</ng-template>
<ng-template ngbTabContent>
<p>Art party scenester stumptown, tumblr butcher vero
sint qui sapiente accusamus tattooed echo park.</p>
</ng-template>
</ngb-tab>
<ngb-tab title="Disabled" [disabled]="true">
<ng-template ngbTabContent>
<p>Sed commodo,vel tellus pulvinar feugiat.</p>
</ng-template>
</ngb-tab>
</ngb-tabset>
typescript:
export class PrintingDocumentsEditComponent implements OnInit {
public titleLegend: object;
public entities: Entity[];
public departments: Departament[];
public voucherTypes: VoucherType[];
public printDocumentDataInit: any;
if data% lamb-form-print-document
is set the first time you load the normal load page but when I move from one tab to another, I return to the tab that contains the form component. the forms are cleaned.
As far as I was reading, this happens because the <ng-template>
that uses the ng-bootstrap tabs generate this action, that is, they destroy and build intangibles of what is contained within the label as required. What I need is that the data is not destroyed when I move from one tab to another.
If necessary you can give some suggestions for modifying the ng-bootstrap tabset, since I am creating a custom using the ng-bootstrap tabsets as a guide.
Thank you.