将数据传递到角度6中的其他组件

时间:2018-09-06 10:26:38

标签: javascript angular

我正在使用angular 6构建我的Web应用程序。我有一些在所有路线上都通用的通用组件。例如,我有一个在所有路径上都通用的过滤器组件。现在,当用户选择一个过滤器时,单击查找,该过滤器数据应传递到同一路线上的不同组件,然后显示结果。 PFB我的角度的应用程序结构: App.component.html:

security set-key-partition-list -S apple-tool:,apple:,codesign: -s -k keychainPass keychainName

对于破折号路线,我有破折号组件。 PFB是dash.component.html的代码:

<filter (messageToDash)="receiveMessage($event)"></filter>
<router-outlet></router-outlet>

Filter.component.html

<dashboard></dashboard>

因此,当用户单击按钮时,我想将一些变量传递给仪表板组件。我还尝试使用服务组件并将其订阅到仪表板的ngOnInit()变量中,但它无法正常工作。

2 个答案:

答案 0 :(得分:0)

创建一个服务,并在父级提供该服务作为参考,然后单击(单击)按钮,将过滤器数据传递给具有返回类型可观察到的函数,并在组件中订阅该函数的结果。 由于ngOnInit生命周期仅在页面加载开始时初始化,因此可能没有太大帮助。

答案 1 :(得分:0)

几个月前,我也遇到了同样的问题,当时我得到的最佳解决方案是使用WHERE (t.hour >= 0 AND t.hour <= 2 AND t.minute >= 0 and t.minute <= 59) OR (t.hour = 3 AND t.minute = 0) 例如:

LocalStorageService

import { LocalStorageService } from 'ngx-webstorage';

现在在另一个组件中,只需导入constructor(private session: LocalStorageService) { //works at the begining of the module before OnInit } some_function() { this.session.store('key_name',yourData); } 并为其创建一个obj,然后:

LocalStorageService

注意:用于存储和检索的some_function() { this.your_variable = this.session.retrieve('key_name'); } 必须相同。 希望这会有所帮助。