如何将主要组件分为两个子组件

Question

我正在开发Angular应用程序，我必须在工具栏中的两个按钮（btn1，btn2）之间切换。这些按钮位于称为“设计”的组件中。它是App组件的一部分。工具栏上还有5个具有不同功能的按钮。我想为具有不同逻辑的两个按钮（btn1，btn2）共同实现这五个功能。如果我在同一组件中执行所有操作，则代码将变得更加复杂和冗长。有人可以建议我，什么是降低复杂性的最佳方法。

[编辑] 文件结构

merge(DT, DT2$name, on=c(iso="iso", year="year", A="name"), all.x = TRUE, allow.cartesian=FALSE)

在Designcomponent.html中，我有按钮代码 在Designcomponent.ts中，我有按钮逻辑的代码。 我想将Designcomponent1.ts绑定到Designcomponent.ts中的btn1，并将DesignComponent.ts绑定到Designcomponent.ts中的btn2以及其他五个按钮。如何为他们添加路由。

Answer 1

您的文件夹结构和文件结构应如下所示。

parentcomponent/
├── childcomponent1/
│   ├── childcomponent1.component.html
│   ├── childcomponent1.component.ts
│   ├── childcomponent1.component.scss
├── childcomponent2/
│   ├── childcomponent2.component.html
│   ├── childcomponent2.component.ts
│   ├── childcomponent2.component.scss
└── parentcomponent.component.html
└── parentcomponent.component.ts
└── parentcomponent.component.scss
└── parentcomponent.module.ts
└── parentcomponent.service.ts

parentcomponent/ ├── childcomponent1/ │ ├── childcomponent1.component.html │ ├── childcomponent1.component.ts │ ├── childcomponent1.component.scss ├── childcomponent2/ │ ├── childcomponent2.component.html │ ├── childcomponent2.component.ts │ ├── childcomponent2.component.scss └── parentcomponent.component.html └── parentcomponent.component.ts └── parentcomponent.component.scss └── parentcomponent.module.ts └── parentcomponent.service.ts

然后在“父组件”中导入childcomponent1.component和childcomponent1.component类。