# @embedpdf/angular 中文文档

规范地址：https://npmcn.com/package/%40embedpdf/angular/

版本：3\.2\.0
npm 元数据更新时间：2026-11-11T23:25:29.237Z
中文译文更新时间：2026-11-14T01:14:11.071Z
软件包许可：Apache-2\.0

本文由上游 README 翻译，可能存在偏差，请结合原文核对 API、命令与配置。版权与许可归原作者所有。

原始 npm 页面：https://www.npmjs.com/package/%40embedpdf/angular
原文对照：https://npmcn.com/package/%40embedpdf/angular/?lang=original
项目主页：https://github.com/embedpdf/embed-pdf-viewer#readme
源码仓库：https://github.com/embedpdf/embed-pdf-viewer

## 关键信息（来自 npm 元数据）

- 包体积（解压后）：1.5 MB，92 个文件
- 模块格式：ES Module
- TypeScript 类型：包内自带
- 运行依赖：31 个
- peer 依赖：rxjs ^7\.4\.0，@angular/cdk \>=20\.2\.0 \<23\.0\.0，@angular/core \>=20\.2\.0 \<23\.0\.0，@angular/forms \>=20\.2\.0 \<23\.0\.0，@angular/common \>=20\.2\.0 \<23\.0\.0
- 首次发布：2026-08-05T21:42:00.693Z
- 最新版本发布：2026-11-11T23:25:28.944Z
- 近 30 天下载量：2621（2026-10-14 至 2026-11-12，npm 官方下载统计）
- 已发布版本数：27（近 12 个月 27 个）

## 中文简介

用 EmbedPDF 构建自己的 PDF 查看器的角服务和组件 .

## 安装

```sh
npm install @embedpdf/angular
```

也可以使用：`pnpm add @embedpdf/angular`、`yarn add @embedpdf/angular`、`bun add @embedpdf/angular`

## README

# @embedpdf/angular (英语)

用 EmbedPDF 构建自己的 PDF 查看器的角服务和组件 .

## 快开始

本指南构建一个小型 PDF 查看器: 页面、 文本人员可以选择、 缩放按钮、 a 高亮和保存按钮。 每个步骤都添加一个插件或一个控件,这样您就可以停止任何 台阶并有一个工作查看器.

### 1\. 安装

你需要两个包:一个是框架,一个是引擎.

```sh
npm install @embedpdf/angular @embedpdf/engine
```

每个特性都是从框架包中单独导入的,例如 `@embedpdf/angular/stage`, (中文(简体) ), 所以,你不用的东西 从来没有达到你的捆绑.

### 2\. 显示 PDF

一次创建引擎,然后把它给 `provideEmbedPdf()` 您想要的插件和文档 打开. `<epdf-stage>` 显示页面,以及 `<epdf-render-layer>` 绘制每个 :

**`basic.ts`**

```ts
import { ChangeDetectionStrategy, Component } from '@angular/core';
import { EpdfDocumentGate, provideEmbedPdf } from '@embedpdf/angular/runtime';
import type { OpenInput } from '@embedpdf/angular/runtime';
import { EpdfPageTemplate, EpdfStage, withStage } from '@embedpdf/angular/stage';
import { EpdfRenderLayer, withRender } from '@embedpdf/angular/render';
import { localEngine } from '@embedpdf/engine';

// The local engine opens bytes: fetch lazily, under the loading tab.
const welcome = async (): Promise<OpenInput> => {
  const response = await fetch('https://www.embedpdf.com/pdfs/welcome.pdf');
  return { kind: 'bytes', id: 'welcome', bytes: new Uint8Array(await response.arrayBuffer()) };
};

// The component that provides the viewer renders it: the engine is created in the browser,
// and costs nothing until the first document opens, so the page renders at once.
@Component({
  selector: 'demo-root',
  imports: [EpdfDocumentGate, EpdfStage, EpdfPageTemplate, EpdfRenderLayer],
  providers: [
    provideEmbedPdf(
      { engine: () => localEngine(), initialDocuments: [{ source: welcome }] },
      withStage(),
      withRender(),
    ),
  ],
  changeDetection: ChangeDetectionStrategy.OnPush,
  template: `
    <div style="height: 500px">
      <!-- Document UI is defined over a document: gate it on having one. -->
      <epdf-stage *epdfDocumentGate="let document; fallback: loading" style="height: 100%">
        <ng-template epdfPage>
          <epdf-render-layer />
        </ng-template>
      </epdf-stage>
    </div>

    <ng-template #loading><p>Loading…</p></ng-template>
  `,
})
export class App {}
```

`localEngine()` 在它被使用之前,没有付出任何代价, 所以它的安全在你的组件,即使与 服务器侧渲染 。 浏览器在浏览器中开始: PDFium 靴子装入 Web Worker in the 背景,第一页显示文档打开后立即显示。 引擎的Web大会是 从您所在的站点开始的建筑和负载部分;见 [设置](https://www.embedpdf.com/docs/headless/angular/setup)。 。 。 .

`*epdfDocumentGate` 显示其 `fallback` 直到文档打开为止,所以舞台永远不会变成 没有一个.

## 每个插件

每个插件为一导入行 。 注册插件并导入其组件来自 同一个地方:

| 插件 | 它给你什么 | 从 |
| :-- | :-- | :-- |
| [阶段](https://www.embedpdf.com/docs/headless/angular/viewing/stage) | 滚动、缩放、布局、页面导航 | `@embedpdf/angular/stage` |
| [渲染器](https://www.embedpdf.com/docs/headless/angular/viewing/render) | 每个缩放、深角瓦片的清晰页 | `@embedpdf/angular/render` |
| [链接](https://www.embedpdf.com/docs/headless/angular/viewing/links) | 可点击的网页和网站链接 | `@embedpdf/angular/link` |
| [选择](https://www.embedpdf.com/docs/headless/angular/text/selection) | 选择和复制文本 | `@embedpdf/angular/selection` |
| [搜索](https://www.embedpdf.com/docs/headless/angular/text/search) | 查找文本, 并显示每个匹配 | `@embedpdf/angular/search` |
| [说明](https://www.embedpdf.com/docs/headless/angular/annotations) | 突出显示、注解、形状、自由文本和你自己的工具 | `@embedpdf/angular/annotation` |
| [邮票](https://www.embedpdf.com/docs/headless/angular/annotations/stamps) | 邮票图书馆,通过点击或编码放置 | `@embedpdf/angular/stamp` |
| [计量](https://www.embedpdf.com/docs/headless/angular/annotations/measurements) | 实际规模的距离、周边和地区 | `@embedpdf/angular/measurement` |
| [编辑](https://www.embedpdf.com/docs/headless/angular/annotations/redaction) | 永远删除内容 | `@embedpdf/angular/redaction` |
| [表单](https://www.embedpdf.com/docs/headless/angular/forms) | 填充和建造PDF表格 | `@embedpdf/angular/form` |
| [签署](https://www.embedpdf.com/docs/headless/angular/forms/signatures) | 签署文件和检查签名 | `@embedpdf/angular/signature` |
| [页面编辑](https://www.embedpdf.com/docs/headless/angular/documents/pages) | 旋转、重排、插入和删除页面 | `@embedpdf/angular/page-edit` |
| [元数据](https://www.embedpdf.com/docs/headless/angular/documents/metadata) | 文件的标题、作者和您自己的字段 | `@embedpdf/angular/metadata` |
| [字体](https://www.embedpdf.com/docs/headless/angular/documents/fonts) | 文档的字体可以写入, 绘制为引擎写入的字体 | `@embedpdf/angular/fonts` |
| [大纲](https://www.embedpdf.com/docs/headless/angular/documents/outline) | 文档的大纲(其书签),用于显示、跟踪和编辑 | `@embedpdf/angular/outline` |
| [附录](https://www.embedpdf.com/docs/headless/angular/documents/attachments) | 包含 PDF 文件: 列出、保存、附加和删除 | `@embedpdf/angular/attachment` |
| [行动](https://www.embedpdf.com/docs/headless/angular/documents/actions) | PDF 本身做什么:按钮、脚本、打印 | `@embedpdf/angular/actions` |
| [查看管理器](https://www.embedpdf.com/docs/headless/angular/documents/tabs) | 几个文件并存 | `@embedpdf/angular/view-manager` |
| [互动](https://www.embedpdf.com/docs/headless/angular/ui/tools) | 活动工具、光标和触摸 | `@embedpdf/angular/interaction` |
| [图标](https://www.embedpdf.com/docs/headless/angular/ui/commands) | 用标签、图标和快捷键命名动作 | `@embedpdf/angular/commands` |
| [贝壳](https://www.embedpdf.com/docs/headless/angular/ui/panels) | 打开哪些面板、对话框和菜单 | `@embedpdf/angular/shell` |
| [翻译](https://www.embedpdf.com/docs/headless/angular/ui/translations) | 您的用户语言UI | `@embedpdf/angular/i18n` |

## 文档

-   [快开始](https://www.embedpdf.com/docs/headless/angular/quick-start): 一步一步地构建一个PDF取景器,其中包含文本选择,缩放按钮,亮点和保存按钮.
-   [设置](https://www.embedpdf.com/docs/headless/angular/setup):服务器侧渲染,捆绑,字体,并亲自主持引擎.
-   [如何运作](https://www.embedpdf.com/docs/headless/angular/concepts/how-it-works):插件,你的用户界面如何与它们交谈,层层,以及哪个组件的谈话文件.
-   [滚动、缩放和布局](https://www.embedpdf.com/docs/headless/angular/viewing/stage):布局,缩放模式,页面导航和触摸.

## 许可证

阿帕奇 - 2.0

## 常见问题

### @embedpdf/angular 是什么？

用 EmbedPDF 构建自己的 PDF 查看器的角服务和组件 \.

### 如何安装 @embedpdf/angular？

在项目目录运行 npm install @embedpdf/angular，或使用 pnpm add / yarn add / bun add。它还需要宿主项目提供 peer 依赖：rxjs（^7\.4\.0）、@angular/core（\>=20\.2\.0 \<23\.0\.0）、@angular/common（\>=20\.2\.0 \<23\.0\.0）。npm 7 及以上与 pnpm 8 及以上默认会自动安装必需的 peer 依赖，Yarn 需要手动安装。

### @embedpdf/angular 支持 TypeScript 吗？

支持。包内自带 TypeScript 类型声明（package\.json 声明了 types 入口），安装后即可获得类型提示，无需再安装 @types 包。

### @embedpdf/angular 支持 ESM 还是 CommonJS？

以 ES Module 形式发布，推荐使用 import 引入。在 CommonJS 项目中，Node\.js 20\.19\+ / 22\.12\+ 可以直接 require\(\) 不含顶层 await 的 ES Module，更早的版本需要改用动态 import\(\)。

### @embedpdf/angular 可以商用吗？

@embedpdf/angular 使用 Apache-2\.0 许可。宽松许可：允许商业使用、修改和再分发，并附带明确的专利授权；分发时需保留许可与 NOTICE 文件，修改过的文件要注明改动。以上为概括，不构成法律意见，请以许可原文为准。

### @embedpdf/angular 的下载量有多少？

根据 npm 官方下载统计，@embedpdf/angular 在 2026/10/14 – 2026/11/12 这 30 天内被下载 2,621 次，日均约 87 次。下载量会把 CI 构建、镜像同步和作为其他包依赖的安装一并计入，适合横向比较热度，不能直接等同于使用人数。

### @embedpdf/angular 还在维护吗？

最新版本 3\.2\.0 发布于 2026/11/12（2 天前）；至今共发布 27 个版本，其中过去 12 个月发布了 27 个；首次发布于 2026/08/06。发布频率只是参考信号：功能稳定的工具可能很少需要更新，建议结合源码仓库的 issue 和提交记录判断。