Question

我不确定我在这里做错了什么......

基本上我有2个兄弟组件，第一个组件获取一些数据，我想与兄弟组件共享该数据，所以我已经提供了服务

服务

.query

然后在我的第一个组件......

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

@Injectable()
export class DataService {
    // Individual Data Source
    private dataSource = new BehaviorSubject<Object>({});
    // Individual Data Source
    data = this.dataSource.asObservable();
    // Individual Data Source
    updateData(data) {
        this.dataSource.next(data);
    }
}

然后在我的第二部分..

this.activatedRoute.params.subscribe(params => {
  this.id = params.id;
  this._dataNotification.getSingledataNotification(this.id)
    .subscribe(result => {
      this.data = result;
      this._dataService.updateData(this.data);
    });
});

基本上发生的事情是在我的第一个组件中我将数据对象返回并将其传递给updateData函数然后在我的第二个组件中我获取该数据但是当我控制日志时我只返回一个空对象??

任何想法我做错了什么？

修改

我将updateData函数放在onChanges生命周期事件中，现在它工作..

谢谢大家

Answer 1

这个创建一个服务来处理消息事件。

import { Injectable } from '@angular/core';
import { Observable } from 'rxjs/Observable';
import { Subject } from 'rxjs/Subject';

@Injectable()
export class MessageService {
  private subject = new Subject<Message>();

  send(key: string, value: any) {
    this.subject.next({ key, value });
  }

  get(): Observable<Message> {
    return this.subject.asObservable();
  }
}

class Message {
  constructor(
    public key: string,
    public value: any) { }
}

这一个听取事件，当得到事件时执行......

import { Subscription } from 'rxjs/Subscription';
private subscription: Subscription;

constructor(
  private messageService: MessageService,
) {}

ngOnInit() {
  this.subscription = this.messageService.get().subscribe(message => {
    if (message.key === 'what message you want') {
      this.dosth()
    }
  });
}

如果要将对象从一个服务发送到另一个服务，请在消息服务中调用发送并订阅所需的服务。

Answer 2

当我必须实现相同的场景时，我遇到了类似的问题。

解决方案是，您不应该在onInit()方法内的接收组件中接收数据。而是通过onChanges()方法或事件（如按钮单击）来接收它。它将返回带有值的对象。

在兄弟组件Angular 5之间传递对象{}

2 个答案: