介绍
ngx-json-localstorage 是一个可以将 JSON 对象存储到本地存储中的 Angular 应用程序的 npm 包。它提供了一种简单的方式来进行本地存储，使得应用程序可以在不依赖任何服务器的情况下，通过本地储存的方式来持久化存储一些数据。
本文将会从如何安装 ngx-json-localstorage 开始，介绍使用 ngx-json-localstorage 的基本操作，最后介绍如何在一个实际应用程序中使用它。
安装
--- ------- ------ ---------------------
安装后，我们可以在我们的应用程序中引入它。
------ - ------------------------- - ---- ------------------------
-----------
-------- -
-----------------------------------
--
--
------ ----- --------- --使用
既然我们已经安装了 ngx-json-localstorage，并将其添加到了我们的应用程序中，我们就可以开始使用它了。这个库提供了一个名为 NgxJsonLocalStorageService 的服务来调用本地存储。
在组件中使用:
------ - --------- - ---- ----------------
------ - -------------------------- - ---- ------------------------
------------
--------- -----------
------------ -----------------------
---------- -----------------------
--
------ ----- ------------ -
------------------- --------------- --------------------------- - -
------------ ------- ------ ---- -
---------------------------------- -------
-
------------ ------- -
------ -----------------------------------
-
-如上所示，我们可以导入 NgxJsonLocalStorageService，并将其注入到我们的组件中。然后我们可以通过 setObject 和 getObject 方法来储存或获取 JSON 对象。这里的 setObject 方法接收两个参数，一个是键值对中的键，另一个是要储存的值。getObject 方法接收一个参数，即键值对中的键。
示例:
------ - --------- - ---- ----------------
------ - -------------------------- - ---- ------------------------
------------
--------- -----------
--------- -
------- ----------------------- -------------
----
--- ----------- ---- -- --------- ---- -------
-----
--
---------- -----------------------
--
------ ----- ------------ -
------ ------------- - ---
------------------- --------------- --------------------------- - -
--------- -
----- ------- - ----- - - ------------------ - ---
-------------------------
-------------------------------------- ------------
-
----------- ---- -
---------- - -------------------------------------- -- ---
-
-如上所示，我们可以在我们的组件中使用 setObject 方法来存储一个数组。在组件的 OnInit() 方法中，我们可以使用 getObject 方法来获取这个数组。这使我们的应用程序可以记住我们添加的项目，并在重新加载页面后加载它们。
结论
如您所见，ngx-json-localstorage 提供了一种简单的方式来进行本地存储，并且可以轻松地在 Angular 应用程序中使用。通过这个库，我们可以在客户端储存数据，并且在不依赖任何服务器的情况下持久化这些数据。希望本文介绍的使用方法对您有帮助！
来源：JavaScript中文网 ，转载请联系管理员！ 本文地址：https://www.javascriptcn.com/post/600668e3d9381d61a3540a57