使用Angular2隐藏或显示导航栏中的按钮

Question

我的 main.ts 文件中有 5 个组件。我有一个标题组件，用于根据我单击的组件进行更新。我已将此组件放在我的 app.component.html 文件中。每当我单击 5 个组件中的任何一个时，我都想在标题/导航栏中显示后退按钮。 我还有一个底部导航栏，单击此处可以转到三个不同的视图，第一个是主视图，另外两个是其他视图。 以下是我的应用程序的模型。

我想在单击任何组件时更新导航标题，并显示或隐藏后退箭头按钮。 当我单击屏幕底部的查看按钮时，我想相应地更新标题。 我应该创建一个服务并将其注入每个组件吗？ 请在这方面提供帮助。

Answer 1

共享服务

拥有共享服务绝对是一种解决方案。这是来自official documentation 的一个很好的示例，说明了如何实现它。

状态管理 (ngRx)

另一个可能更复杂的解决方案是实施某种状态管理解决方案。 ngRx 是一种专门为 Angular v.2+ 开发的实现（使用 redux 模式）。

它所做的基本上是为您提供一个保存所有应用程序状态的 store。然后，应用程序中的组件可以订阅商店以读取数据。

当然，它的意义远不止于此。以下是一些资源：

• GitHub repository and ngrx/store
• 一篇关于 ngrx 的中型博客文章（part 1, part 2）
• A great article about state management in angular (not specific to ngrx)