介绍
thmsltmnn-ng-jhipster 是一个基于 Angular 和 JHipster 开发的 npm 包。它提供了一系列的 Angular 指令和组件，可以帮助开发者快速搭建一个符合 JHipster 规范的前端项目。
本文将详细介绍 thmsltmnn-ng-jhipster 的使用教程，包括安装、配置、指令和组件的使用等。
安装
首先，你需要先安装 Node.js 和 npm。然后，在项目目录下执行以下命令进行安装：
npm install thmsltmnn-ng-jhipster --save
安装完成后，在项目中使用时，需要在模块中先引入该包：
-- -------------------- ---- -------
------ - ---------------- - ---- ------------------------
-----------
------------- -
------------
--
-------- -
----------------
-
--
------ ----- --------- - -配置
在使用 thmsltmnn-ng-jhipster 之前，你需要针对项目进行一些配置。
首先，在项目根目录下找到 angular.json 文件，在 styles 数组中添加 JHipster 的样式文件：
"styles": [ "node_modules/thmsltmnn-ng-jhipster/public/css/global.css", "src/styles.css" ],
然后，在 tsconfig.json 中添加以下配置，以支持 JHipster 的日期格式化工具：
"compilerOptions": {
"paths": {
"app/timezone": ["./src/main/webapp/app/shared/util/timezone.ts"]
}
}然后，将 timezone.ts 文件复制到 src/main/webapp/app/shared/util 目录下，源文件在 JHipster 项目的目录中可以找到。
指令和组件
thmsltmnn-ng-jhipster 提供了一些常用的 Angular 指令和组件，可以帮助开发者快速搭建一个符合 JHipster 规范的前端项目。
ng2-datetime-picker
ng2-datetime-picker 是一个日期和时间选择器，可以支持多语言和自定义格式。
使用方法：
<datetime-picker [(ngModel)]="dateValue" [valueType]="'local'" [weekStart]="'locale'" [dateFormat]="'YYYY-MM-DD HH:mm:ss'" ></datetime-picker>
其中，dateValue 是绑定的数据，valueType 是时间类型，weekStart 是星期开始的日子。
NgJhipsterPagination
NgJhipsterPagination 是一个分页组件，支持自定义每一页的大小。
使用方法：
<ng-jhipster-pagination [itemsPerPage]="10" [(page)]="page" [totalItems]="totalItems" [maxPagesToShow]="5" ></ng-jhipster-pagination>
其中，itemsPerPage 是每一页的大小，page 是绑定的当前页面，totalItems 是总数，maxPagesToShow 是最多展示的页数。
DataUtils
DataUtils 是一个工具类，提供了常用的操作。
使用方法：
-- -------------------- ---- -------
------ - --------- - ---- ------------------------
------ ----- ----------- -
------------
------- ---------- ---------
- --
------------------ ---- ------------ ------- -
----- -------- - --------------------------- -------------
------------------------------------- ------------
-
-其中，toBlob 方法可以将任意数据转换成 Blob 对象，downloadBlob 方法可以进行下载。
总结
本文详细介绍了 thmsltmnn-ng-jhipster 的使用教程，包括安装、配置、指令和组件的使用等。通过使用 thmsltmnn-ng-jhipster，你可以快速搭建一个符合 JHipster 规范的前端项目，提高开发效率。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/600563a281e8991b448e11a0