前言
现代 Web 应用通常使用前后端分离的架构，前端负责展示和用户交互，后端负责数据和业务逻辑处理。而对于前端开发人员来说，调用后端接口通常是必须掌握的技能之一。而 ng-on-rest-create 这个 npm 包，可以帮助我们快速创建 Angular 应用中调用 RESTful API 的代码。
安装
使用 npm 安装 ng-on-rest-create
npm install ng-on-rest-create
使用
1. 引入 HttpClientModule
HttpClient 是 Angular 内置的 HTTP 客户端，用于向服务器发起请求。因此，在使用 ng-on-rest-create 之前，我们需要首先引入 HttpClientModule，代码如下：
-- -------------------- ---- ------- ------ - -------- - ---- ---------------- ------ - ------------- - ---- ---------------------------- ------ - ---------------- - ---- ----------------------- ----------- -------- --------------- ------------------ ------------- --------------- ---------- -------------- -- ------ ----- --------- - -
2. 根据后端 API 文档定义接口
在使用 ng-on-rest-create 时，我们需要根据后端 API 文档定义接口，并将接口定义放在一个单独的 TypeScript 文件中。接口定义需要包含请求方法、资源路径、请求参数、响应类型等信息。比如，下面是一个简单的接口定义示例：
-- -------------------- ---- -------
------ - -------- ------ - ---- --------------------
------ ----- ---------------- ---------- - -
-
----- ---------
-------- -
----- -
------- -----
--
------- -
------- ------
-
-
-
--本例中，我们定义了一个 books 资源，并定义了两个动作：list 和 create，分别对应后端的 GET 和 POST 请求。注意，这里的请求方法使用大写字母表示。
3. 执行 createResources 方法
在接口定义完成之后，我们需要调用 createResources 方法来创建代码。createResources 方法接受两个参数，一个是接口定义，另一个是 http 客户端。代码如下：
-- -------------------- ---- -------
------ - --------- - ---- ----------------
------ - ---------- - ---- -----------------------
------ - --------------- - ---- --------------------
------ - --------------- - ---- ---------------------
------------
--------- -----------
------------ ----------------------
--
------ ----- ------------ -
------------------- ----------- ----------- -
----- --------- - -------------------------------- ------------
-
-这里我们调用了 createResources 方法，并将结果存储在 resources 变量中。httpClient 参数是 http 客户端，由 Angular 自带的 HttpClient 实例提供。
4. 调用自动生成的函数
自动生成的函数具有与接口定义中定义的动作相同的名称。对于列表操作 list，自动生成的函数名为 list()。对于其他操作，自动生成的函数名以操作名称开头，例如 createBook()。我们可以在组件或服务中直接调用这些函数。代码如下：
-- -------------------- ---- -------
------ - --------- - ---- ----------------
------ - ---------- - ---- -----------------------
------ - --------------- - ---- --------------------
------ - --------------- - ---- ---------------------
------------
--------- -----------
------------ ----------------------
--
------ ----- ------------ -
------------------- ----------- ----------- -
----- --------- - -------------------------------- ------------
--------------------------------------- -- -
------------------
---
------------------------ ------ ------- ------------------- -- -
------------------
---
-
-这里我们分别调用了 list() 和 create() 函数，并使用 subscribe() 方法处理异步响应。
总结
借助 ng-on-rest-create，我们可以方便地根据后端 API 文档生成 Angular 应用中调用 RESTful API 的代码。这不仅提高了开发效率，同时还可以减少出错概率，保证项目质量。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/60056e9d81e8991b448e75cb