組件之間的角度 - 共享服務不起作用

我有一個服務，我聲明我的變量。在我的組件中，我使用這個變量來將數據放入它。組件之間的角度 - 共享服務不起作用

服務：

@Injectable() 
export class DataService { 

    public msgs = []; 

    constructor() { }  

}

現在我用這個變量在我的組件：

export class MessagesComponent implements OnInit { 

    constructor(private dataService: DataService){} 

    ngOnInit() { 
     this.getData(); 
    } 

    getData(){ 
     let msgs = []; 

     if (diffr <= this.geomessage[i].range) { 
      this.geomessage[i].dist = diffr; 
      msgs.push(this.geomessage[i]); 
      //console.log("this message: ", this.geomessage[i]); //DEBUG 
     } 
     this.dataService.msgs = msgs; 

    }  
}

我只貼了必要的code.The this.dataService.msgs HET充滿信息能正常工作。當我到另一個組件時，this.dataService.msgs的數據仍然存在，但是當我回到Messagescomponentthis.dataService.msgs是undefined直到我再次填充它，但我需要其中的數據。有人知道如何做到這一點？

THX

來源

2017-05-16 user3356007

如果您提供您的DataService您@Component註釋的供應商陣列內，

@Component({ 
    ... 
    providers: [DataService], 
})...

這項服務將是一個單身（它會創建一個新的實例），該組件（和如果他們還沒有在他們的註釋下提供這項服務，那麼他們就是孩子）。

如果您想在多個組件之間使用此服務並共享相同的服務實例，您需要在DI樹中這些組件的父級組件中提供此服務。如果這是全球服務，我建議在您的AppModule中（或在共享模塊中）提供只有。

@NgModule({ 
    providers:[DataService] 
})

來源

2017-05-16 09:35:19 echonax

沒有添加在NgModule我會嘗試 – user3356007

@ user3356007也從'@ Component'註釋中移除它 – echonax

如何在組件中使用它如果我不把它放在組件的提供程序構造函數中？ – user3356007

只是快速闡述echonax的回覆，是提供者作爲一個層次結構工作。如果您將其添加到應用程序模塊，它將在整個應用程序中運行，因此您不應該在其他地方「提供」它。但是，如果不需要「全局」服務，只需將其提供給父組件即可。

來源

2017-06-02 12:50:34

組件之間的角度 - 共享服務不起作用

回答

相關問題