# @angular-extensions/elements 中文文档
规范地址：https://npmcn.com/package/%40angular-extensions/elements/
版本：22\.0\.0
npm 元数据更新时间：2026-08-20T17:26:31.024Z
中文译文更新时间：2026-11-06T04:11:29.914Z
软件包许可：MIT
本文由上游 README 翻译，可能存在偏差，请结合原文核对 API、命令与配置。版权与许可归原作者所有。
原始 npm 页面：https://www.npmjs.com/package/%40angular-extensions/elements
原文对照：https://npmcn.com/package/%40angular-extensions/elements/?lang=original
项目主页：https://github.com/angular-extensions/elements#readme
源码仓库：https://github.com/angular-extensions/elements
## 关键信息（来自 npm 元数据）
- 包体积（解压后）：107 kB，11 个文件
- 模块格式：ES Module
- TypeScript 类型：包内自带
- 运行依赖：1 个
- peer 依赖：@angular/common \>=22，@angular/core \>=22，rxjs \>=7\.5\.0
- 首次发布：2019-07-12T18:43:09.064Z
- 最新版本发布：2026-08-20T17:26:30.628Z
- 近 30 天下载量：70406（2026-10-06 至 2026-11-04，npm 官方下载统计）
- 已发布版本数：76（近 12 个月 3 个）
## 中文简介
## 安装
```sh
npm install @angular-extensions/elements
```
也可以使用：`pnpm add @angular-extensions/elements`、`yarn add @angular-extensions/elements`、`bun add @angular-extensions/elements`
## README
# 维也纳展期要点
### 在您的 Angular 应用程序中, 懒惰地装入 Angular Elements 或任何其他网络组件的简单方式 !
以 [@tomastrajan (英语)](https://twitter.com/tomastrajan)
[](https://www.npmjs.com/package/@angular-extensions/elements) [](https://github.com/angular-extensions/elements/blob/master/LICENSE) [](https://www.npmjs.com/package/@angular-extensions/elements) [](https://travis-ci.org/angular-extensions/elements) [](https://codecov.io/gh/angular-extensions/elements) [](https://conventionalcommits.org/) [](https://twitter.com/tomastrajan)
## 文档
- [文档](https://angular-extensions.github.io/elements/)
- [开始](https://angular-extensions.github.io/elements/#/docs/getting-started)
- [使用大小写](https://angular-extensions.github.io/elements/#/docs/use-cases)
- [财务问题](https://angular-extensions.github.io/elements/#/docs/faq)
- [API 密码](https://angular-extensions.github.io/elements/#/docs/api)
- [实例](https://angular-extensions.github.io/elements/#/examples)
- [博客文章](https://medium.com/@tomastrajan/the-best-way-to-lazy-load-angular-elements-97a51a5c2007)
- [专题演讲(视频)](https://www.youtube.com/watch?v=X__jkPGYRUs)
## 快速启动
1. 安装 `npm i @angular-extensions/elements`
2. 添加 `import { LazyElementDirective } from '@angular-extensions/elements'`· ;
3. 附录 `LazyElementDirective` 页:1 `imports: []` 您的电话 `MyOrgComponent`
4. 添加新内容 `schemas: []` 属性为 `CUSTOM_ELEMENTS_SCHEMA` 值为 `@Component` 您的装饰器 `MyOrgComponent`
5. 使用 `*axLazyElement` 关于您想要在元素捆绑的url中装入并传递的元素的指令
构成部分实施实例
```typescript
import { Component, CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
import { LazyElementDirective } from '@angular-extensions/elements';
@Component({
selector: 'your-org-feature',
imports: [LazyElementDirective],
schemas: [CUSTOM_ELEMENTS_SCHEMA],
template: `
`,
})
export class MyOrgComponent {
elementUrl = 'https://your-org.com/elements/some-element.js';
data: SomeData;
handleChange(change: Partial) {
// ...
}
}
```
## 支持的角版本
图书馆用下列版本的Angular进行了测试,意在使用 与相应的主要版本(`"@angular/core"": "^15.0.0"` 与 `"@angular-extensions/elements": "^15.0.0"` ) (中文(简体) ).
- 9.x(全IVY支持,使用制造器对安全部门改革非常小心)
- 8.x (部分IVY支持, `axLazyElement` 工作不过 `axLazyElementDynamic` 与IVY无关)
- 7.x 电话
- 6.x (例如: `npm i @angular-extensions/elements@^6.0.0`(中文(简体) )
## 内部解析图
## 成为贡献者
#### 缺少一个功能, 在文档中找到错误或打字吗 ?
请随便开张吧 [问题](https://github.com/angular-extensions/elements/issues) 或提交 [拉动请求](https://github.com/angular-extensions/elements/pulls) 让这个项目变得更好
## 发起人
> 您现在正在一个 **企业多雷波环境** 并且发现自己认为你能够提供如此多的价值 除非你有更好的总体规划 跟踪进展 并且把事情做好?
尝试 _[倾斜板](https://omniboard.dev/),是主要软件工程师和建筑师的最佳工具_ 帮助他们获得一个概览 驱动更改 **企业多雷波环境** 通过查询和追踪他们的代码基础!
免费计划让你用第一个仪表板 来全面概述你的所有项目 追踪到三个不同的东西!
[](http://www.youtube.com/watch?feature=player_embedded&v=uDnNE9FuLwc)
## 常见问题
### 如何安装 @angular-extensions/elements？
在项目目录运行 npm install @angular-extensions/elements，或使用 pnpm add / yarn add / bun add。它还需要宿主项目提供 peer 依赖：@angular/common（\>=22）、@angular/core（\>=22）、rxjs（\>=7\.5\.0）。npm 7 及以上与 pnpm 8 及以上默认会自动安装必需的 peer 依赖，Yarn 需要手动安装。
### @angular-extensions/elements 支持 TypeScript 吗？
支持。包内自带 TypeScript 类型声明（package\.json 声明了 types 入口），安装后即可获得类型提示，无需再安装 @types 包。
### @angular-extensions/elements 支持 ESM 还是 CommonJS？
以 ES Module 形式发布，推荐使用 import 引入。在 CommonJS 项目中，Node\.js 20\.19\+ / 22\.12\+ 可以直接 require\(\) 不含顶层 await 的 ES Module，更早的版本需要改用动态 import\(\)。
### @angular-extensions/elements 可以商用吗？
@angular-extensions/elements 使用 MIT 许可。宽松许可：允许商业使用、修改和再分发，通常只需在分发时保留原版权与许可声明。以上为概括，不构成法律意见，请以许可原文为准。
### @angular-extensions/elements 的下载量有多少？
根据 npm 官方下载统计，@angular-extensions/elements 在 2026/10/06 – 2026/11/04 这 30 天内被下载 70,406 次，日均约 2,347 次。下载量会把 CI 构建、镜像同步和作为其他包依赖的安装一并计入，适合横向比较热度，不能直接等同于使用人数。
### @angular-extensions/elements 还在维护吗？
最新版本 22\.0\.0 发布于 2026/08/21（2 个月前）；至今共发布 76 个版本，其中过去 12 个月发布了 3 个；首次发布于 2019/07/13。发布频率只是参考信号：功能稳定的工具可能很少需要更新，建议结合源码仓库的 issue 和提交记录判断。
