简介
要在 Web 开发中实现删除操作，通常需要考虑两个问题：一是如何发起删除请求，二是如何获得用户的确认。ngx-delete-confirm 是一个 Angular 开发的 npm 包，可以帮助我们解决第二个问题，即提供一个易用的、美观的删除确认对话框。
安装
使用 ngx-delete-confirm 之前，需要先安装并引入 Angular。
$ npm install @angular/core
然后安装 ngx-delete-confirm：
$ npm install ngx-delete-confirm --save
使用
- 在目标组件的模块里引入 ngx-delete-confirm 模块：
-- -------------------- ---- -------
------ - ------------------- - ---- ---------------------
-----------
-------- -
-- ---
-------------------
--
-- ---
--
------ ----- ---------- - -- 在目标组件里引入 DeleteConfirmService，使用其提供的 delete() 方法：
-- -------------------- ---- -------
------ - -------------------- - ---- ---------------------
------ - --------------- - ---- ----------------------
------------
--------- ---------------------
-- ---
--
------ ----- ------------- -
------------
------- --------------------- ---------------------
------- ---------------- ---------------
- - -
-------------- ------- -
------------------------------------- --- ---- -- ------ ---- --------
------------- -- -------------------------------------
-
-带样式的按钮
如果希望在界面上显示成带样式的按钮，可以参照这个示例：
<button class="btn btn-danger" (click)="deleteUser(user.id)"> <span class="fa fa-trash-o"></span> Delete </button>
-- -------------------- ---- ------- ------- ----------------------------------------------- -- ------ ------ ----- -------------- ----------------- ------ ----------------- ----- --------- -------- --- -------------- - ----------------- ---------------------- --------- ------ ---------------------- ------------------ -
结语
ngx-delete-confirm 是一个易用、美观的删除确认对话框的 npm 包，可以方便地打造交互友好的 Web 应用程序。希望这篇文章对你有所帮助。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/6005607881e8991b448dea39