angular - Ruteparametere typekonvertering

Jeg går for øyeblikket gjennom Angular 2-opplæringen og lærer hvordan man bruker ruteren med parametere for å hente objektdatert ved hjelp av en id.

Nedenfor er koden som brukes i forbindelse med spørsmålet jeg vil stille.

Her er rute-definisjonen i app.module.ts for å dirigere til en komponent basert på en id

      {
        path:'detail/:id',
        component:HeroDetailComponent
      }

Servicemetode (fra Service-klassen) for å hente data basert på id

getHero(id: number): Promise<Hero> {
    return this.getHeroes()
    .then(heroes => heroes.find(hero => hero.id === id));
}

Og konstruktøren og OnInit-metoden (fra hero-details.component hvor dataene vil bli vist) brukes for å hente informasjonen fra URL-en

constructor(
private heroService: HeroService,
private route: ActivatedRoute,
private location: Location
){}

ngOnInit():void{
  this.route.params
    .switchMap((params:Params) => this.heroService.getHero(+params['id'])
      .subscribe(hero => this.hero = hero));
}

Og til slutt et eksempel på dataene vi henter inn. id er av typen nummer og name av typen streng.

{ id: 11, name: 'Mr. Nice' }

SPØRSMÅL: Innenfor ngOnInit konverterer vi id fra en streng til et tall innenfor parameterne til this.heroService.getHero()-kallet. Hvordan fungerer egentlig +params['id'] med tanke på konvertering? Min gjetning var at det skyldes hvordan vi la opp ruten i app.module.ts-filen, og at detail/:id tilsvarer params['id'], men jeg ønsker en tydelig forklaring slik at jeg vet med sikkerhet hva jeg gjør i fremtiden. Takk

Svar #1

Params-objektet er en konstruksjon laget og fylt av Angular2-routeren for å holde parametrene du spesifiserer i rutene. Nøkkel-verdi-parene samsvarer med :id (nøkkel) og den faktiske ruteverdien under kjøring. Params kan holde mer enn én parameter.

Pluss (+params['id']) du refererer til er en standard JavaScript-operator som forteller tolken å konvertere param-resultatet fra hvilken som helst type det er (streng) til et tall.

Se denne referansen: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Arithmetic_Operators#Unary_plus_(.2B)

Den unære plus-operatoren plasseres foran sin operand og evaluerer til dens operand, men forsøker å konvertere den til et tall hvis den ikke allerede er det.

+3     // 3
+"3"   // 3
+true  // 1

Relaterte artikler