在这篇文章中，我们将了解ngrx、状态、动作、reducers以及ngrx的工作原理。
那么，让我们从ngrx开始。
什么是Ngrx？
Ngrx是一个状态管理框架，用于在angular中创建反应式应用程序。
它有六个基本部分。
1.选择器
2.存储器
3.减速器
4.行动
5.组件
6.效果
Ngrx状态管理的生命周期
组件是应用程序的UI部分，用户在其中进行交互。每一次交互都会产生一个动作，描述一个事件，然后将其分配给还原器。
还原器根据当前的状态和最新的动作来计算新的状态，然后将其存储在商店中。
现在，选择器的工作是选择存储空间中的特定数据并将其传递给组件。
而效果器是在没有数据需要被还原器处理的时候使用。
效果的工作是通过调用服务来完成数据，服务进一步调用外部数据库，并将数据返回给效果，然后效果产生一个带有适当数据的新动作，并传递给还原器，还原器然后计算新的状态并将其存储在商店中。
什么是Ngrx中的存储？
存储是一种状态数据。它类似于数据库，每当组件需要数据时，它就会发送给该组件。
NgRx Store通过使用单一的状态和动作来表达状态变化，使状态管理能够构建可维护的、明确的应用程序。
所以首先让我们看看存储的例子：
const state = {
user: {
email: 'aanchal@gmail.com',
token: 'Secret token',
},
posts: [
{
id: '1',
title: 'Hello',
description: 'Hello world',
},
{
id: '2',
title: 'Hii',
description: 'Hii world',
},
],
};
什么类型的数据你不应该保存在商店里？
1.未共享的状态： 如果一个组件有一些数据，并且不需要将其发送给其他组件，这意味着它只限于该组件，那么就没有必要将数据保存在存储中。
2. Angular表单： 表单数据不需要保留在状态中，因为它不是不可变的，如果你正在输入一些东西，那么它就会自动改变。这与状态管理原则相冲突。
当表单被提交时，你可以获取数据，并可以分配动作，这样状态就会存储数据。
3.路由器数据： 路由器数据不存储在商店里，因为它有一些复杂的数据结构。
什么是Ngrx中的动作？
在组件中执行的任何事件（例如，执行的点击事件）都会分配一个动作。
你有一个单独的动作文件，动作在其中被写入，数据将在动作文件中被发送。
在Ngrx中，动作是最重要的构建部分之一。动作描述了在你的应用程序中发生的独一无二的事件。
行动代表了各种事件，包括用户与网站的互动，通过网络请求的外部互动，以及与设备API的直接连接。
例如：
const LoginAction = {
type: 'LOGIN',
user: {
email: 'aanchal@gmail.com',
password: '12345'
}
}
const RegisterAction = {
type: 'Register',
user: {
email: 'aanchal@gmail.com',
password: '12345'
}
}
什么是Ngrx中的还原器？
减速器负责处理从一个状态到下一个状态的转换。在一个动作被派发后，它执行一些数据。
还原器是纯函数，在这个意义上，它们对相同的输入总是返回相同的结果。它们没有负面效应，并及时处理每个状态的转换。每个还原器函数都会考虑最近派遣的Action，以及现有的状态，以决定是返回一个新修改的状态还是原始状态。
比如说
const _sharedReducer = createReducer(
initialState,
on(showLoading, (state, action) => {
return {
...state,
loading: action.loading,
loadingText: action.text ? action.text : 'loading',
};
}),
on(setErrorMessage, (state, action) => {
return {
...state,
errorMessage: action.message,
};
})
)
结论
我们已经看到了ngrx的介绍，它的生命周期，状态、动作和还原器是如何工作的。
