在同一模型的页面之间切换

Question

我开始使用 Angular（目前是 Angular5）并且有一个关于在同一模型的页面之间切换的问题。

例如，我有一个基于 AngularJS 的旧项目。假设我们有模型客户。该模型的页面将是：

• page-customers（包含现有客户表的页面）
• page-new-customer（带有用于创建新客户的表单/向导的页面）
• page-view-customer（查看现有客户信息的页面+选项 更新）

现在在 AngularJS 中，我将创建 3 条不同的路由将我们发送到这 3 个页面。在这些页面中我会包含（ng-include）表格、表格等，所以我不会重复太多的html并尝试重复使用它。

我的问题是，在 Angular 中最好/正确的方法是什么？这是否意味着我有带有许多组件的客户模块（例如PageCustomersComponent、PageNewCustomerComponent、PageViewCustomerComponent）和连接到每个组件的路由，或者这些是不同的模块（例如PageCustomersModule 等）和再次与他们连接的路线？

另外，如果我想重新使用表单在PageViewCustomer 中创建客户进行更新，这是否意味着我需要为此表单创建一个新组件？基本上，我想知道 AngularJS 的 ng-include 有什么替代品。

谢谢

Answer 1

您可以通过多种方式做到这一点，我个人的做法是使用嵌套在 customer.component 中的辅助 <router-outlet></router-outlet>。

在customer.module 中，我将为三个页面定义路由。我会让每个页面（新客户、查看客户和客户表）成为他们自己的组件，并且根据这些页面的大小和其中调用的方法，我会更进一步，将页面的不同部分组件化，即表格, Forms等，因此可以在父组件之间复用。

此链接有一个很好的实现示例。 https://angular-2-training-book.rangle.io/handout/routing/child_routes.html