如何将数据从一个孩子传递给父母和其他孩子组件？

Question

我已将页面分为以下格式。我有一个父组件和多个子组件。第一个是过滤器组件。因此，当我在此组件中进行提交时，其结果将在所有其他子组件以及父组件中实现。

我认为这是我从子级A到父级组件收到的日期将其传递给子级B和子级C，但我无法解决它。

我在这里工作： https://stackblitz.com/edit/angular-fqp5px

有人可以帮我吗？

谢谢。

Answer 1

您可以只创建简单的服务并将值传递给Subject对象。并在您想使用它的其他组件中订阅该对象。

例如服务：

import { Observable } from 'rxjs/Observable';
import 'rxjs/add/operator/map';
import 'rxjs/add/observable/of';
import { Subject } from 'rxjs';

@Injectable()
export class dataService {
    //here i am giving example for string. You can use any kind of object(class)
    private querySource = new Subject<string>();
    query$ = this.querySource.asObservable();

    functionname(value: string){
               this.querySource.next(value);
     }
}

现在预订此服务，并在“提交”按钮上调用functionName函数。更改将在父项或任何其他子项中的任意位置订阅。

要获得参考，请通过this