简介
angularx-local-storage 是一个基于 Angular 框架的本地存储插件，可以方便的在浏览器中进行数据存储和读取。该插件底层使用的是 Web Storage API，支持 localStorage 和 sessionStorage 两种存储方式。
安装
你可以通过 npm 安装 angularx-local-storage，使用以下命令：
npm install angularx-local-storage --save
使用
在 angularx-local-storage 中，我们可以使用两种模式来进行存储和读取数据：
- 基于观察者模式
-- -------------------- ---- -------
------------------- -------------------- -------------------- - -
----------- ---- -
-- -- ---- -------------- ------------ -
---------------------------------------------------------- -- -
----------------- ----- ---------- -------
---
-
------------- ---- -
-- -- ---- ----
------------------------------------ ---- ---- --------
-- 基于直接操作 API 的模式
-- -------------------- ---- ------- ------------------- -------------------- -------------------- - - ----------- ---- - -- - ------------ --- ---- ---- ----- --------- - ------------------------------------- ----------------- ----- -------- ----------- - ------------- ---- - -- - ------------ --- ---- ---- ------------------------------------ ---- ---- -------- -
示例代码
-- -------------------- ---- -------
-- -------------
------ - -------- - ---- ----------------
------ - ------------- - ---- ----------------------------
------ - ------------ - ---- ------------------
------ - ------------------ - ---- -------------------------
-----------
-------- --------------- ----------------------------
------- ---------
------------ --------------
----
------------- ---------------
---------- --------------
--
------ ----- --------- - -
-- ----------------
------ - --------- - ---- ----------------
------ - ------------------- - ---- -------------------------
------------
--------- -----------
--------- -
-------------------------- ---------
-------- -- ---- ------
------- ----------------------------- -------------
-
--
------ ----- ------------ -
----- -------
------------------- -------------------- -------------------- -
-- - ------------ --- ---- ----
--------- - -------------------------------------
-
------------- ---- -
-- - ------------ --- ---- ----
------------------------------------ ---- ---- --------
-- -- -- --
--------- - ---- ---- -------
-
-总结
通过本文，你已经学习了如何在 Angular 应用中使用 angularx-local-storage 进行本地数据存储和读取。在实际项目中，你可以根据自己的需求选择不同的存储方式，并结合该插件的 API 进行数据的操作。通过熟练使用 angularx-local-storage，可以为你的项目节省很多开发时间和精力。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/60057c2881e8991b448ebb88