typescript - Angular: Hur man får @Input-setters att kallas i viss ordning?


Jag skapar en komponent. Eftersom jag gillar Apache Wickets sätt att göra saker på, försöker jag efterlikna IModel-sättet att skicka data. För det, till barnkomponenten skickar jag en modell och callbacks som kan hämta de relevanta värdena, istället för att kalla en funktion för att få datan på förhand.

Problemet är att hanteringen av den nyinställda modellen använder callbacks. Så om modulinställaren kallas innan callbacks har ställts in, kraschar Angular.
Arbetsrundlösning: skjuta upp de åtgärder som behöver callback till ngAfterViewInit() eller liknande.

Kort sagt:

  • Hur kan jag kontrollera i vilken ordning @Inputs sätts?
  • Kan jag lita på ordningen i källkoden?

Exempel: (Att ändra ordningen här verkar göra susen)

@Input()
valueCallback: (item: any) => string
    = app => { throw new Error("valueCallback not yet defined."); };

@Input()
labelCallback: (item: ItemType) => string;

Mall som använder den barnkomponenten: (att ändra ordningen här ändrar inte ordningen)

            <wu-checkboxes [groupName]="'includedApps'"
                           [options]="availableApps"
                           [valueCallback]="appsValueCallback"
                           [labelCallback]="appsLabelCallback"
            >

Som jag nämner ovan verkar Angular2 följa ordningen på @Input-klassens medlemmar och sätter/anropar dem i den ordningen. Frågan är, är det de-facto eller de-jure? Jag vill inte förlita mig på funktioner som fungerar bara för att det för närvarande är kodad på det sättet. Jag vet inte mycket om JavaScript-reflektion, så jag kan inte säga om detta kommer att fungera överallt.

Svar #1

Du kan använda ngOnChanges() som anropas varje gång en @Input() uppdateras av ändringsdetektering. Du kan kontrollera inom ngOnChanges om alla inmatningsvärden redan är tillgängliga och sedan köra din kod. Du måste dock själv se till att efterföljande uppdateringar inte triggar funktionsanropet igen (om detta inte är önskvärt).

uppdatera

Ordningen på bindningar (värdebindningar och händelsebindningar) är odefinierad i Angular2 och därför kan du inte förlita dig på en specifik ordning.

Relaterade artiklar