组件之间的angular度共享服务不起作用

我有一个服务，我宣布我的variables。 在我的组件中，我使用这个variables来把数据放入它。

服务：

@Injectable() export class DataService { public msgs = []; constructor() { } } 

现在我在我的组件中使用这个variables：

 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; } } 

我只发布了必要的代码this.dataService.msgs het填充消息这工作正常。 当我到另一个组件的数据this.dataService.msgs仍然存在，但是当我回到Messagescomponent this.dataService.msgs是undefined直到我再次填充它，但我需要它的数据。 有人知道如何做到这一点？

谢谢

Answer 1

如果您在@Component注释的提供者数组内提供DataService ，

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

这个服务将是这个组件的一个单例（它将创build一个新的实例）（如果它们还没有在它们的注解下提供这个服务的话，那么它就是孩子）。

如果您想在多个组件之间使用此服务并共享相同的服务实例， 您需要在DI树中的这些组件的父级组件/模块中提供此服务。 如果这是一个全球性的服务，我build议只在您的AppModule（或共享模块）中提供它。

 @NgModule({ providers:[DataService] }) 

Answer 2

只要快速阐述echonax的答复，就是提供者作为一个层次结构工作。 如果将其添加到应用程序模块，它将在整个应用程序中工作，因此您不应该在其他地方“提供”它。 但是，如果不需要“全局”服务，只需在父组件上提供即可。