Angular2中的共享服务和Observable，BehaviourSubject

Question

我有共享服务SharedService

@Injectable()
export class SharedService {
  private title = new BehaviorSubject<string>("");
  currentMessage = this.title.asObservable();
  constructor() { }
  setData(val: string) {
    this.title.next(val);
  }
}

我有一个组件，我可以获得新数据

export class Fill implements OnInit {
public title;

  constructor(public shared: SharedService) {
  }
  ngOnInit() {
this.shared.setData(this.title);
}}

组件Info，我想要读取新数据   导出类InfoComponent实现OnInit {

  constructor(public shared: SharedService) { 
    this.title = ''; }
  ngOnInit() {

    console.log('i am title from info ')
    this.shared.currentMessage.subscribe(title => this.title = title)
    console.log(this.shared.currentMessage);
    console.log(this.title);
}}

在console.log的两种情况下，我都会获得包含我需要的信息的对象 - 但我无法检索它的值。所以，在我的控制台上看起来像

但如果尝试类似

的话

的console.log（this.shared.currentMessage.source.source.value）;

它说属性＆＃39;来源＆＃39;受到保护，只能在课堂上观看＆＃39; Observable＆＃39;及其子类。

this.shared.currentMessage.value
this.title.value

也不起作用...... 我怎样才能检索一个或另一个的数据（值）？

Answer 1

是。 @wostex 正确地提到了它。将ngOninit放在构造函数的一边，

this.shared.currentMessage.subscribe(title => {

     this.title = title;
     console.log(this.title)
})

Answer 2

ngOnInit必须在构造函数之外。

正如@micronkys指出的

当您订阅一个observable时，this.title的值在下一行中不可用，因为订阅是异步的，因此标题剂量会更新。当你记录它时。

尝试在模板中使用*ngIf = "title"，如下所示

<div *ngIf = "title">
  {{title}}
</div>

<强>更新

this.shared.currentMessage.subscribe((title) => {
                          this.title = title;
                          console.log(this.title)
}

请找到问题的plunker，希望您现在得到答案

Answer 3

<强>更新

我怀疑currentMessage = this.title.asObservable();是SharedService Injectable中的this.title无效行。

您可以编写一种方法，通过currentMessage方法公开@Injectable() export class SharedService { private title = new BehaviorSubject<string>(""); //below line was wrong. //currentMessage = this.title.asObservable(); currentMessage(){ return this.title.asObservable(); } constructor() { } setData(val: string) { this.title.next(val); } } //Usage console.log(this.shared.currentMessage().getValue()); 公开，如下所示

ngOnInit

是的，您应该首先从构造函数中取出BehaviourSubject。我想你想要检索console.log(this.shared.currentMessage.getValue()); 的初始状态，那么你可以在Observable上使用.getValue()函数而无需订阅流。

https://www.facebook.com/profile.php?id=100004774025067