关于功能库
ABP 拥有不断增长的功能模块,并且随时可能引入新模块。当使用 Angular 作为 UI 时,这些功能都配有相应的模块化 Angular 库。
功能库内容
每个库至少包含两个关键要素:
- 功能定义 - 封装了实现特定功能 UI 所需的所有组件、服务、类型、枚举和路由逻辑。在独立结构中,这通常通过
routes.ts文件和关联组件来表达,我们将其称为**"功能结构"**。 - 配置提供程序 - 公开设置逻辑,例如
provideMyProjectNameConfig()函数或环境特定的令牌,允许在不同应用中以不同方式初始化或集成功能。我们将其称为配置结构。
如何将功能库添加到项目
手动设置功能库包含三个步骤:
1. 安装库
功能库通常作为 npm 包发布。如果您要使用的库在项目中不存在,可以通过以下命令安装:
yarn add @my-company-name/my-project-name
...或...
npm install @my-company-name/my-project-name
my-company-name 和 my-project-name 部分将根据您要使用的包而变化。例如,如果我们要安装 ABP Identity 模块,包安装将如下所示:
yarn add @abp/ng.identity
Identity 仅作为示例使用。如果您是通过 ABP CLI 或 ABP Suite 初始化项目的,身份库将已安装并在项目中配置完成。
2. 导入配置提供程序
从 ABP v9.3 开始,每个懒加载路由都有一个配置提供程序,可通过同一包上的次要入口点获取。在根配置中导入它们如下所示:
import { provideIdentityConfig } from "@abp/ng.identity/config";
export const appConfig: ApplicationConfig = {
providers: [
// 其他提供程序
provideIdentityConfig(),
],
};
我们需要配置提供程序来执行在功能结构加载(懒加载)之前需要的操作。例如,上述导入配置了菜单以显示指向身份页面的链接。
此外,根据库的不同,.createRoutes 静态方法可能会接收一些配置功能工作方式的选项。
3. 导入功能定义
最后,功能结构应该通过 Angular 路由器懒加载。在独立设置中,路由通常在 app.routes.ts 文件中定义,功能模块被路由级功能定义取代。您应该看到身份路由配置如下:
import { Routes } from "@angular/router";
const APP_ROUTES: Routes = [
// 其他路由
{
path: "identity",
loadChildren: () =>
import("@abp/ng.identity").then((m) => m.createRoutes()),
},
// 其他路由
];
当您这样加载身份功能时,例如"用户"页面的路由路径将是 /identity/users。1
根据库的不同,.createRoutes 静态方法也可能接收一些配置功能工作方式的选项。
1 库期望在预定义路径下工作。如果您想使用与默认路径(例如 '/identity')不同的路径,请查看如何修补导航元素。 ↩
抠丁客


