typescript - Anpassad komponent i Angular uppdateras inte


Jag försöker lära mig Angular (Angular 6) och jag har skapat två komponenter, component-a och component-b. I mallen för component-a använder jag component-b på detta sätt:

<component-b [configuration]="selectedConfiguration" *ngIf="selectedConfiguration != null">
    </component-b>

där selectedConfiguration är en egenskap hos component-a som används som indata för component-b.

Jag skulle ha förväntat mig att om jag i kontrollern för component-a tilldelar ett nytt värde till selectedConfiguration, på detta sätt:

this.selectedConfiguration = newConfig;

instansen av component-b skulle åter skapas, med den nya konfigurationen som indata, precis som vad som händer inuti ett ngIf om du lägger till/ta bort/ersätter ett objekt i den underliggande arrayen. Istället händer inget om jag tilldelar ett nytt objekt till selectedConfiguration.

Vad gör jag för fel?

Svar #1

Svarar för att stänga frågan, eftersom lösningen hittades genom kommentarerna.

Tack vare NicolasLaw-Dune har jag listat ut problemet: jag trodde att ändring av värdet i component-a skulle skapa en ny instans av component-b med det nya värdet, men jag hade fel. Istället uppdateras bara värdet inuti den befintliga instansen av component-b. Med denna vetskap ändrade jag min kod i component-b för att reagera på ändringen, genom att implementera OnChanges-gränssnittet i component-b, kontrollera om det ändrade värdet var min ingångsegenskap och uppdatera komponenten därefter.

Svar #2

Kan du prova i komponent-b:

export class component-b {
  @Input() configuration: any;

  <some methods with configuration>

}