de-vraag
Daugiau
Question

Kaip "Angular 2" / "Typescript" sistemoje deklaruoti globalųjį kintamąjį?

Norėčiau, kad kai kurie kintamieji būtų pasiekiami visur Angular 2 kalba Typescript. Kaip turėčiau tai padaryti?

Jeff
Jeff
Redaguotas klausimas priešpietr gegužė 2019 в 1:01
Programavimas
angular
typescript
Šis klausimas turi 1 atsakymas atsakymų anglų kalba, norėdami juos perskaityti prisijunkite prie savo paskyros.
Solution / Answer

Čia pateikiamas paprasčiausias sprendimas be Service ir Observer:

Įrašykite globalius kintamuosius į failą ir eksportuokite juos.

//
// ===== File globals.ts    
//
'use strict';

export const sep='/';
export const version: string="22.2.2";

Norėdami naudoti globaliuosius kintamuosius kitame faile, naudokite importo teiginį: ```import * as myGlobals from './globals';````

Pavyzdys:

// 
// ===== File heroes.component.ts    
//
import {Component, OnInit} from 'angular2/core';
import {Router} from 'angular2/router';
import {HeroService} from './hero.service';
import {HeroDetailComponent} from './hero-detail.component';
import {Hero} from './hero';
import * as myGlobals from './globals'; //<==== this one

export class HeroesComponent implements OnInit {
    public heroes: Hero[];
    public selectedHero: Hero;
    // 
    //
    // Here we access the global var reference.
    //  
    public helloString: string="hello " + myGlobals.sep + " there";

         ...

        }
    }

Ačiū @eric-martinez

snorkpete
snorkpete
Redaguotas atsakymas priešpietr gegužė 2017 в 5:13
187

Geriausias būdas - bendroji paslauga

export class SharedService {
  globalVar:string;
}

Tačiau registruodami ją turite būti labai atsargūs, kad galėtumėte dalytis vienu egzemplioriumi su visa programa. Ją reikia apibrėžti registruojant programą:

bootstrap(AppComponent, [SharedService]);

bet ne apibrėžti jį dar kartą savo komponentų providers atributuose:

@Component({
  (...)
  providers: [ SharedService ], // No
  (...)
})

Priešingu atveju komponentui ir jo subkomponentams bus sukurtas naujas jūsų paslaugos egzempliorius.

Galite peržiūrėti šį klausimą apie tai, kaip "Angular2" veikia priklausomybių injekcija ir hierarchiniai injektoriai:

Galite pastebėti, kad tarnyboje taip pat galite apibrėžti Observable savybes, kad praneštumėte savo programos dalims, kai pasikeičia jūsų globalios savybės:

export class SharedService {
  globalVar:string;
  globalVarUpdate:Observable<string>;
  globalVarObserver:Observer;

  constructor() {
    this.globalVarUpdate = Observable.create((observer:Observer) => {
      this.globalVarObserver = observer;
    });
  }

  updateGlobalVar(newValue:string) {
    this.globalVar = newValue;
    this.globalVarObserver.next(this.globalVar);
  }
}

Daugiau informacijos rasite šiame klausime:

Community
Community
Redaguotas atsakymas popietr gegužė 2017 в 12:18
53

Pavyzdžiui, žr. https://stackoverflow.com/questions/35993778/angular-2-implementation-of-shared-services.

@Injectable() 
export class MyGlobals {
  readonly myConfigValue:string = 'abc';
}

@NgModule({
  providers: [MyGlobals],
  ...
})

class MyComponent {
  constructor(private myGlobals:MyGlobals) {
    console.log(myGlobals.myConfigValue);
  }
}

arba pateikite atskiras reikšmes

@NgModule({
  providers: [{provide: 'myConfigValue', useValue: 'abc'}],
  ...
})

class MyComponent {
  constructor(@Inject('myConfigValue') private myConfigValue:string) {
    console.log(myConfigValue);
  }
}
Demodave
Demodave
Redaguotas atsakymas popietr vasaris 2018 в 2:46
37