【问题标题】:How to create Angular2 library with multiple routes?如何创建具有多个路由的 Angular2 库?
【发布时间】:2017-05-29 08:56:15
【问题描述】:
我是 Angular2 的新手,我需要构建一个可重用的库,该库将被多个应用程序用作 html 标记。
这个可重复使用的库将有多个页面,例如搜索、创建、编辑等,这会转化为库本身内的多个路由。但是 Git 上的大部分库都不使用路由器。
所以我的问题是如何设计我的多页可重用库?
我是否应该将所有内容(搜索、创建、编辑)放在一个组件中并使用 ngIf 显示/隐藏同一页面中的部分。但我相信应该有某种方法来处理库中的路由,而不会弄乱正在使用的应用程序路由。
您能否建议我一种设计方法。即使您可以向我指出一些关于如何构建 Angular2 库的指南或帖子,这也会有很大帮助。
【问题讨论】:
标签:
angular
npm
angular-ui-router
shared-libraries
components
【解决方案1】:
这个可重复使用的库将有多个页面,如搜索、创建、编辑等,这将转换为库内的多个路由。
你说的这部分是对的。您可以在 yoir 库中使用路由并像普通的 Angular 应用程序一样导航。只需确保您的库中有这些路由的相应组件即可。
将您的库路由类导出到 public_api。
将您的 RoutingModule 与库模块一起导入您的应用程序。
【解决方案2】:
我会避免将路由信息直接放入库中。在您的库上构建的每个应用程序都可能具有不同的路由机制:不同的路由名称、不同的路由保护,甚至可能是不同的路由库。
如果您为图书馆提供开箱即用的预配置路由,则会强制图书馆的用户遵循您的路线想法。如果某人已经定义了一个路由“/search”并且您可能会覆盖该路由,那将导致挫败感。同样,如果有人决定使用自定义路由服务而不是 Angular 的,他们可能无法使用您的库。或者,如果有人想在标签视图中将所有视图放在一个 Component 中,这可能并不容易。
我的建议是发送NgModule,其中声明了Components 的编号。允许您的用户以他们想要的方式使用这些组件。如果他们使用您的所有组件,他们可以为每个组件设置一个路由。如果他们想将所有这些都放在一个页面上的标签中,他们也可以这样做。