[NgRx] Setting up NgRx Router Store and the Time-Travelling Debugger
Make sure you have the@ngrx packages installed:
"@ngrx/data": "^8.0.1",
"@ngrx/effects": "^8.0.1",
"@ngrx/entity": "^8.0.1",
"@ngrx/router-store": "^8.0.1",
"@ngrx/store": "^8.0.1",
"@ngrx/store-devtools": "^8.0.1",
To enable time travel debugging, you need to import:
app.module.ts
imports: [
...
StoreRouterConnectingModule.forRoot({
stateKey: "router", // key will be "router"
routerState: RouterState.Minimal // the content to be saved into store will be minimal
})
],
Enable add reducer for router:
reducers/index.ts
import { routerReducer } from "@ngrx/router-store"; export const reducers: ActionReducerMap<AppState> = {
router: routerReducer
};
[NgRx] Setting up NgRx Router Store and the Time-Travelling Debugger的更多相关文章
- ngrx/store effects 使用总结1:计数器
本教程案例github:https://github.com/axel10/ngrx_demo-counter-and-list angular2+ 的学习成本应该是三大框架中最高的一个,教程及案例稀 ...
- Angular应用架构设计-3:Ngrx Store
这是有关Angular应用架构设计系列文章中的一篇,在这个系列当中,我会结合这近两年中对Angular.Ionic.甚至Vuejs等框架的使用经验,总结在应用设计和开发过程中遇到的问题.和总结的经验, ...
- 如何在AngularX 中 使用ngrx
ngrx 是 Angular框架的状态容器,提供可预测化的状态管理. 1.首先创建一个可路由访问的模块 这里命名为:DemopetModule. 包括文件:demopet.html.demopet.s ...
- [转]VS Code 扩展 Angular 6 Snippets - TypeScript, Html, Angular Material, ngRx, RxJS & Flex Layout
本文转自:https://marketplace.visualstudio.com/items?itemName=Mikael.Angular-BeastCode VSCode Angular Typ ...
- 翻译:使用 Redux 和 ngrx 创建更佳的 Angular 2
翻译:使用 Redux 和 ngrx 创建更佳的 Angular 2 原文地址:http://onehungrymind.com/build-better-angular-2-application- ...
- Redux 和 ngrx 创建更佳的 Angular 2
Redux 和 ngrx 创建更佳的 Angular 2 翻译:使用 Redux 和 ngrx 创建更佳的 Angular 2 原文地址:http://onehungrymind.com/build- ...
- [Angulalr] Speed Up Reducer Development Using Ngrx Schematics
When we use NGRX, we need to create some bolipates. Now with Angulalr6, we can use CLI to generate t ...
- [Angular] NgRx/effect, why to use it?
See the current implementaion of code, we have a smart component, and inside the smart component we ...
- Vue3: 如何以 Vite 创建,以 Vue Router, Vuex, Ant Design 开始应用
本文代码: https://github.com/ikuokuo/start-vue3 在线演示: https://ikuokuo.github.io/start-vue3/ Vite 创建 Vue ...
随机推荐
- Git服务器搭建--ssh/http
测试环境 Windows 7 Ultimate, 64-bit 6.1.7601, Service Pack 1(实体机,虚拟机VMware的宿主机) VMware® Workstation 7.1. ...
- QT json数据的应用(cJSON)
json数据可保存小量的数据在本地的json文件中.QT有两种方式操作:(1).cJSON (2).QT的操作json数据的类. 应用:将监控预案数据保存在本地中. 1.首先根据预案结构创建一个jso ...
- 1183: 零起点学算法90——海选女主角(C语言)
一.题目 http://acm.wust.edu.cn/problem.php?id=1183&soj=0 二.分析 从描述来看,就是找出一个二维数组中绝对值最大的数: 带符号的32位整数,刚 ...
- matplotlib实例笔记
下面的图型是在一幅画布上建立的四个球员相关数据的极坐标图 关于这个图的代码如下: #_*_coding:utf-8_*_ import numpy as np import matplotlib.py ...
- Docker 方式部署的应用的版本更新
前言 公司使用 Docker-Compose 的方式部署 Jenkins/Gitlab/Sonar/Confluence/Apollo/Harbor/ELK/MySQL 等一系列开发工具/数据库. 而 ...
- create-react-app中的一些功能配置
1. 根路径别名@ 1. npm run eject调出配置文件.找到webpack.config.js,搜索到,alias,在下面添加一行键值对'@':paths.appSrc, alias: { ...
- 立体像对空间前方交会-共线方程求解法(python实现)
一.原理 二.步骤 a.用各自像片的角元素计算出左右像片的旋转矩阵R1和R2. b.有同名像点列出共线方程. c.将方程写为未知数的线性方程形式,计算线性系数. d.写出误差方程,系数矩阵与常数项. ...
- 怎样获取当前页面框架的数量(即iframe和frame的数量)
需要使用window.length, 或者window.frames.length; 如果页面中不包含frame和iframe元素, 则返回0; window.length === window.fr ...
- RVA与RWA的关系
RVA与RWA的关系 原理比较简单:首先判断这个地址是否在PE头中,如果在,文件偏移和内存偏移相等,如果存在于文件的区段中,则利用以下公式: 内存偏移 - 该段起始的RVA(VirtualAddres ...
- js 遍历树的层级关系的实现
1.遍历树的层级关系 1)先整理数据 2)找到id和数据的映射关系 3)然后找到父节点的数据,进行存储 test() { const list = [ { id: ", parentId: ...