angle2のグローバル変数を更新する方法

Question

angular2を使用しています。グローバル変数アクセスについては、サービスを作成し、コンポーネントページに挿入します。

すべてのページにアクセスできますが、その変数を更新すると、変更は別のページにアクセスしても影響を受けません。

これはこれは私が使用するサービスですGlobaldataServiceのコード

import { Injectable } from '@angular/core'; 
 

 
@Injectable() 
 
export class GlobaldataService { 
 

 
    public var1="haii"; 
 
}

です。

constructor(public obj: GlobaldataService){}

私のコンポーネントページの一つで、私は=「こんにちは」this.obj.var1で変数を更新します。

他のページコンポーネントアラート（this.obj.var1）;しかし、それは "haii"という古い値をディスパッチし、どのようにグローバル変数を更新することができます。事前

Answer 1

で

おかげで、他のコンポーネントとサービスは、彼らが価値のコピーを作成し、あなたのサービスからvar1をお読みください。後でソースを更新すると、他のソースは変更されたソースについて通知されません。彼らはすべて、グローバルサービスから価値を再読み込みする必要があります。

var1の値が文字列ではなくオブジェクトで、オブジェクトを置き換えずにオブジェクトのプロパティのみを変更する場合、コンポーネントとサービスは更新された値を取得する可能性があります。

string、number、booleanなどのプリミティブ値は値でコピーされ、オブジェクトは参照によってコピーされます。

より良いオプションは、関心のあるコンポーネントやサービスが変更をサブスクライブできるようにするObservableを使用することです（アップデートについて積極的に通知されます）。

http://angular.ioのチュートリアルと多くのオンラインチュートリアルでは、オブザーバブルの使用方法が示されています。

Answer 2

あなたが望むのはメッセンジャーサービスです。これは、グローバル変数を維持し、あなたのコンポーネントObservableを更新し、新しい価値ブロードキャストする方法と同様に加入していますです：あなたのコンポーネントで

import { Injectable } from '@angular/core'; 
import { BehaviorSubject } from 'rxjs/BehaviorSubject '; 
import { Observable } from 'rxjs/Observable '; 

@Injectable() 
export class MessengerService { 

    private messageSource: BehaviorSubject<string> = new BehaviorSubject('initialValue'); 
    public message = this.messageSource.asObservable(); 

    public setMessage(value: string) { 
     this.messageSource.next(value); 
    } 
} 

を、あなたは、単に値をサブスクライブしているし、それを更新することができます：

import { Subscription } from 'rxjs/BehaviorSubject '; 

export class ViewComponent implements OnInit, OnDestroy { 

    private messageSubscription: Subscription; 

    constructor(private messengerService: MessengerService) { } 

    ngOnInit() { 
     this.messageSubscription = this.messengerService.message.subscribe(m => { 
      // Do something with your value 
     }); 
    } 

    ngOnDestroy() { 
     this.messageSubscription.unsubscribe(); 
    } 

    setGlobalValue(value: string) { 
     // All components that are subscribed to the 
     // messenger service receive the update 
     this.messengerService.setMessage(value); 
    } 
}