Угловой дочерний компонент не уничтожается, когда следующий элемент в родительском элементе имеет такое же значение переменной для ngIf в селекторе - PullRequest
0 голосов
/ 10 октября 2018

У меня есть числовая переменная с именем currTab, которая используется для перехода по трем элементам div в шаблоне дочернего компонента.Когда в шаблоне родительского компонента выбрана вкладка, дочерний компонент открывается со значением предыдущего экземпляра.По умолчанию при открытии должно быть currTab = 1, но если я выберу 2 или 3, это значение будет иметь следующий дочерний элемент, который открывается из родительского элемента.Я попытался установить значение по умолчанию через @Input currItem через ngOnInit и большинство других событий жизненного цикла, но это не имело никакого эффекта.У меня есть еще одно свойство @Input, которое передается просто отлично.Каждый раз, когда селектор активируется в родительской форме, дочерний компонент отображает правильное «свойство», но не «currTab» по умолчанию.

Дочерний компонент (template-tv-property)

    <input class="propertyTab" type="button" (click)="currTab = 1" value="Main View" [disabled]="currTab == 1" >
<input class=minMaxTab" type="button" (click)="currTab = 2" value="Min Max Values" [disabled]="currTab == 2" >
<input class="propertyTab" type"button" (click)="currTab = 3" value=" Lookup Values" [disabled]="currTab == 3" >

Родительский шаблон

<div  class="itemFrame" *ngIf="currItemType !== ''">
  <template-tv-property [property]="currItem" [currTab]="1" (saveCurrentProperty)="saveCurrentItem($event)" [choiceBoxSize]="propertyChoicesListBoxSize" *ngIf="currItemType === 'property'" ></template-tv-property>
  <template-tv-part [part]="currItem" *ngIf="currItemType === 'part'"></template-tv-part>
  <template-tv-infogroup [infogroup]="currItem" *ngIf="currItemType === 'infoGroup'" ></template-tv-infogroup>
  <template-tv-grid [grid]="currItem" *ngIf="currItemType === 'grid'" ></template-tv-grid>
  <template-tv-signature-group [signatureGroup]="currItem" *ngIf="currItemType === 'signatureGroup'"></template-tv-signature-group>
  <template-tv-signature [signature]="currItem" *ngIf="currItemType === 'signature'"></template-tv-signature>
</div>

1 Ответ

0 голосов
/ 10 октября 2018

В конце концов, на этот вопрос уже был дан ответ.Я не нашел его в первый раз, когда искал.

Уничтожение и перезагрузка дочернего компонента

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...