Question

我有一个带有setter和getter的Service类

@Injectable()
export class DataService {
    name: string;

    getName(): string {
       return this.name
    }

    setName(newname: string) {
        this.name = newname;
    }

}

我也在app.module中定义了这个

providers: [ DataService ]

并在一个组件中设置一个名称，然后尝试从另一个组件中检索。我不确定。

Answer 1

您的组件可能在有机会调用getName之前调用setName。您可能正在ngOnInit中进行此操作。我建议您改为尝试使用此“主题可观察”模式（不要忘记从rxjs导入所需的任何内容）：

service.ts

name: string; // not always necessary/desired
nameSub: BehaviorSubject<string> = new BehaviorSubject(''); // initializing with empty string--could be anything you want
getName: Observable<string> = this.nameSub.asObservable();

setName (name: string) {
  this.name = name; // not always necessary/desired
  this.nameSub.next(name);
}

any-component.ts

myName: string;
sub: Subscription;

ngOnInit () {
  this.sub = dataService.getName.subscribe(name => {
    // assign name to local variable or class property, for example:
    this.myName = name;
  });
}

inputHandler (event) {
  // calling this method will automatically update `myName` through the subscription in ngOnInit!
  dataService.setName(event.name);
}

// Don't forget to unsubscribe when you create your own subscriptions
ngOnDestroy () {
  this.sub.unsubscribe();
}

此模式使您可以将状态保持在一个位置（服务），而且在任何事情发生变化时都可以利用RxJs Observables进行通知。

您可以在此处阅读有关BehaviorSubject和其他内容的信息：http://reactivex.io/rxjs/manual/overview.html#behaviorsubject

角度7：无法从组件之间共享的服务中获取价值

1 个答案: