目前正在使用ngrx 在 angular 5中启动一个新项目，并尝试找出一些架构内容。
应用程序应该从某个类似仪表板的页面开始。在页面顶部，您将有一个带按钮的栏，您可以切换一些小部件（组件）。
我现在遇到的问题是我不知道哪个是在同一页面上显示这些多个组件的最佳方式，因为每个组件都存在于不同的模块中。
因此简而言之，仪表板页面需要显示多个组件，这些组件可以通过切换顶部的菜单按钮来隐藏或显示，每个组件都位于不同的模块中。实际上，每个组件都会有一些操作，可以将您引导到该模块中的页面。
例如，在我的仪表板中，我将有一个小部件项目，其中包含一个包含所有项目的网格，通过双击一行，我将被路由到项目模块中的项目页面。我希望我能说清楚自己。在此先感谢您帮助我进行搜索。
感谢。
答案 0 :(得分：0)
角度很容易。任何组件都可以使用selector插入应用程序中的任何其他位置，该<html>显示在组件的.ts文件的顶部。它可以导入为简单的<my-component>，即
<my-component *ngIf="myBoolean">附加* ngIf指令，使其仅在布尔值为true时出现。
boolean
然后，当单击仪表板按钮时，将<app-nav-bar (toggleOn)="setComponent($event)"></app-nav-bar>设置为true。关闭它，将其设置为false。所以你的app.html文件可能如下所示：
toggleOn(componentName: string) {
if(componentName === 'componentOne') {
showComponentOne ? showComponentOne = false: showComponentOne = true;
}
//...for your components.
}
这是你的导航栏组件。可以有一个名为toggle on的发射器在点击时发出，你可以在app中的setComponent函数中处理它。在那个职能中：
<button (click)="toggle('component1')">Component 1</button>然后在app.html的html中放置你的组件并将* ngIf与它们的布尔值绑定。
在导航栏组件中，您的事件发生器将如下工作： 首先，这是一个切换组件的按钮：
toggleOn = new EventEmitter<string>();
toggle(componentName: string) {
toggleOn.emit(componentName);
}
然后在.ts文件中处理切换函数中的该组件：
{{1}}
使用此策略应解决您的问题，但有很多方法。关于角度传递数据的许多技术的良好阅读来自角度文档。 https://angular.io/guide/component-interaction重点阅读它，你将成为一个更好的开发者！