ng-template angular creates or deletes an instance, every time it does show or hide

0

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.

    
asked by Vitmar Aliaga 15.02.2018 в 20:59
source

1 answer

0

What you are looking for is [destroyOnHide]= by default is set in True

<ngb-tabset [destroyOnHide]="false">
   // Contenido    
</ngb-tabset>
    
answered by 19.02.2018 в 20:31