在Angular 2中創建全局服務變量

如何在Angular 2中的服務中將變量作爲全局變量創建，以便兩個不同的組件可以訪問和修改它？在Angular 2中創建全局服務變量

public myMap : Map<string, string> = new Map<string, string>();

這是服務中的地圖，我最初使用組件填充它。現在，在應用程序的一段時間後，我需要使用不同的組件訪問相同的填充地圖。我怎樣才能做到這一點？

當我使用另一個組件訪問地圖時，它顯示爲未定義。

來源

2017-08-03 in_the_making_always

您是否在兩個組件之間分享了您的服務？ –

1.在服務器中的每個組件中獲取數據。 2.一次獲取數據，存儲在本地存儲中，再次獲取數據時更新存儲。 –

如何在組件之間共享服務？ –

在所有組件之間共享服務。在服務內部，聲明一個變量，它將保存要在組件之間共享的值。然後使用getter和setter從服務中分配，檢索或修改變量，而不必調用服務器。

以下是在多個組件之間共享變量的簡單example。

shared.service.ts：

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

@Injectable() 
export class AppService{ 
    myGlobalVar; 

    constructor(){ 
     this.myGlobalVar = true; 
     alert("My intial global variable value is: " + this.myGlobalVar); 
    } 

    setMyGV(val: boolean){ 
     this.myGlobalVar = val; 
    } 

    getMyGV(val: boolean){ 
     return this.myGlobalVar; 
    } 
}

添加服務app.module.ts供應商：

@NgModule({ 
    ... 
    providers: [ AppService ], 
    bootstrap: [ AppComponent ] 
}) 
export class AppModule { }

在component.ts注射服務，並用它來設置，檢索或修改變量。

constructor(private appService: AppService) { } 

    changeGV(val){ 
    this.appService.setMyGV(val); 
    } 

    showGV(){ 
    alert("GV: " + this.appService.getMyGV()); 
    }

來源

2017-08-03 12:13:19 Nehal

這正是我正在做的，但力度工作。 –

在上面的例子中，我可以有另一個訪問變量myGlobalVar的組件嗎？ –

如果不查看代碼，無法真正瞭解它爲什麼不能工作。確保你已經在'app.module.ts'' providers'中添加了服務，而不是在每個組件中單獨添加。對於上面的示例，您可以擁有儘可能多的組件來共享服務，同樣，您可以注入服務並使用get和set方法。以下是一個[示例]（https://plnkr.co/edit/FWoNtfE4ic3Hi6RdCMsc?p=info），其中服務由六個組件共享。 – Nehal

對於注入服務的組件以下的所有組件，角度服務是單例服務。

換言之，當您在組件A中注入服務時，它將採用此服務的已經存在的實例，如果不存在，它將不會存在，它將創建一個實例。

所以當所有的組件都得到相同的實例時，它內部的每個屬性都將被共享。

來源

2017-08-03 12:58:18 Nour

你是什麼意思在組件下面？我使用的兩個組件完全不相關。 –

對不起，我們的意思是當我們將服務定義爲模塊中的提供者時，它將成爲屬於該模塊的所有組件的單例。 – Nour

在Angular 2中創建全局服務變量

回答

相關問題