Angular 2 Setter和Getter

Question

我正在尝试创建一个服务，将数据解析到不同路由的不同组件中。

如果我在同一个组件上调用下面的服务，我可以得到所需的结果，但如果我尝试从另一个组件获取设置的结果，该服务会返回undefined。

以下是我的服务代码：

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

@Injectable()
export class TestService {

  public _test:any;

  set test(value:any) {
    this._test = value
  }

  get test():any {
    return this._test;
  }
}

我设置了服务如下：-

this.testService.test = 3;

我在组件中使用以下方式获取服务数据：

console.log(this.testService.test)

如之前所述，如果我在同一个组件内进行通信，拥有相同的导入、提供者和构造函数，那么这将完全正常工作。

同时需要注意的是，这些组件是兄弟组件。

如果有人能够帮助或指导我正确的方向，我将不胜感激。

如果您需要任何额外的代码，请告诉我。

- Tony Hensler

---

你是如何注册服务的？在组件中？在模块中？你能展示一下你正在使用的providers数组的代码来注册服务吗？ - DeborahK

我正在组件中使用以下提供程序注册服务：[TestService]，在我的构造函数中，我有一个私有的testService: TestService，并通过import {TestService} from '../../../shared/services/test/test.service';进行导入。 - Tony Hensler

@TonyHensler，你确定它们是兄弟组件吗？这个plunker显示你无法注入在兄弟组件提供程序中定义的服务。 - Max Koretskyi

@Maximus 百分之百确定它们是兄弟姐妹。如果我无法使用服务共享变量到兄弟组件，我如何能够实现我想要做的事情呢？ - Tony Hensler

顺便问一下，实现属性并使用公共字段有什么意义呢？ - Chris Hermut

Answer 1

如果您希望在不是父组件的子组件之间共享服务，您需要在模块中注册服务而不是在组件中注册。当您在组件内部注册服务时，该服务仅对该组件及其子组件可用。

类似这样：

@NgModule({
  declarations: [
    AppComponent,
    ProductListComponent,
    StarComponent
  ],
  imports: [
    BrowserModule,
    FormsModule,
    HttpModule
  ],
  providers: [ TestService ],
  bootstrap: [AppComponent]
})
export class AppModule { }

- DeborahK

Answer 2

如果您想在来自不同模块的两个组件之间进行交互，则必须将服务导入应用程序模块（即主模块），以此方式获取方法不返回。

- arun kumar

Answer 3

如果未定义的变量是"testService"，那么尝试在Component.ts的构造函数中像这样初始化testService变量可能会起作用。

constructor (private testService : TestService ){
      //at this time testService its already initialized.
     console.log(this.testService.test);
}

- Abel Valdez