arv - Deling av oppførsel mellom komponenter i Angular 2 med Typescript

Jeg jobber for øyeblikket med et Angular 2-prosjekt med Typescript.

Jeg har flere komponenter som deler samme oppførsel: de kan alle vise en lastemekanisme (avhengig av om de henter noen data), en feilmelding (hvis hentingen mislyktes), og de abonnerer alle på den samme tjenesten (den som henter dataene). Denne tjenesten oppdaterer dataene hvert 30. sekund, og komponentenes abonnenter gjør nesten det samme med de nye dataene.

Jeg kunne ikke finne en god måte å dele denne oppførselen på.

Jeg prøvde å bruke mixins fra TypeScript, men for det første kan jeg ikke overstyre metoden jeg erklærte i mixin i komponenten min, og for det andre må jeg fortsatt erklære metoder i komponentene mine uten noe inni, slik at kompilatoren min ikke klager.

Jeg prøvde også å bruke dekoratør, men kompilatoren min klager fordi den ikke finner metoden deklarert i dekoratøren.

Jeg prøver endelig å bruke TypeScript-arv med en foreldreskomponent, som ikke har noen mal, det er bare en foreldresklasse. Jeg bruker den med «extends ParentComponent», og legger all logikken min i ParentComponent. Denne siste metoden var den enkleste, men jeg har en sterk følelse av at dette definitivt ikke er den riktige måten (komposisjon over arv, osv.)

Finnes det en måte å gjøre det skikkelig på? Jeg kommer fra Ruby on Rails, noe lignende «concerns» i Ruby ville vært flott.

Svar #1

Lag en ParentComponent som har en router-outlet for å holde den unike oppførselen som (ChildComponents) og dele datamodellen via en delt tjeneste.

Inkluder også lazyloading (rute som bruker loadchildren) for å få modulspesifikk sharedservice.