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的更多相关文章

  1. ngrx/store effects 使用总结1:计数器

    本教程案例github:https://github.com/axel10/ngrx_demo-counter-and-list angular2+ 的学习成本应该是三大框架中最高的一个,教程及案例稀 ...

  2. Angular应用架构设计-3:Ngrx Store

    这是有关Angular应用架构设计系列文章中的一篇,在这个系列当中,我会结合这近两年中对Angular.Ionic.甚至Vuejs等框架的使用经验,总结在应用设计和开发过程中遇到的问题.和总结的经验, ...

  3. 如何在AngularX 中 使用ngrx

    ngrx 是 Angular框架的状态容器,提供可预测化的状态管理. 1.首先创建一个可路由访问的模块 这里命名为:DemopetModule. 包括文件:demopet.html.demopet.s ...

  4. [转]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 ...

  5. 翻译:使用 Redux 和 ngrx 创建更佳的 Angular 2

    翻译:使用 Redux 和 ngrx 创建更佳的 Angular 2 原文地址:http://onehungrymind.com/build-better-angular-2-application- ...

  6. Redux 和 ngrx 创建更佳的 Angular 2

    Redux 和 ngrx 创建更佳的 Angular 2 翻译:使用 Redux 和 ngrx 创建更佳的 Angular 2 原文地址:http://onehungrymind.com/build- ...

  7. [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 ...

  8. [Angular] NgRx/effect, why to use it?

    See the current implementaion of code, we have a smart component, and inside the smart component we ...

  9. Vue3: 如何以 Vite 创建,以 Vue Router, Vuex, Ant Design 开始应用

    本文代码: https://github.com/ikuokuo/start-vue3 在线演示: https://ikuokuo.github.io/start-vue3/ Vite 创建 Vue ...

随机推荐

  1. [Oracle] - 使用 DBMS_UTILITY 查看异常详情

    DBMS_UTILITY.FORMAT_ERROR_BACKTRACE说明:这是在Oracle 10g数据库引入的,DBMS_UTILITY.FORMAT_ERROR_BACKTRACE内置函数返回一 ...

  2. (二)spring初次遇见shiro

    文章目录 集成 Spring 集成中的坑 shiroFilter 的工作原理 权限配置细节 集成 Spring pom.xml 添加shiro相关的依赖 我使用的版本是 ${version.shiro ...

  3. 关于NumPy的常用函数random.randint

    np.random.randint(low, high=None, size=None, dtype='l') 该函数作用:用于产生离散均匀分布的整数 low:生成元素的最小值 high:生成元素的值 ...

  4. 题解-CSA Beta Round#1 Number Elimination

    Problem CSA-Beta Round#3 题意概要:给定 \(n\) 个数组成的序列,定义一次操作: 在当前序列中选择两个数,将其中较小的数从序列中删除(若两个数相同,则删除在序列中更靠前的) ...

  5. 前端开发 Vue -4promise解读2

    https://www.runoob.com/vue2/vue-tutorial.html promise promise是什么?   1.主要用于异步计算 2.可以将异步操作队列化,按照期望的顺序执 ...

  6. 3_PHP表达式_3_有关变量或常量状态的函数

    以下为学习孔祥盛主编的<PHP编程基础与实例教程>(第二版)所做的笔记. 1. 数据类型查看函数 PHP为变量或常量提供了查看数据类型的函数,其中包括gettype()和var_dump( ...

  7. css 垂直方向 margin 边距 重合

    1:控制两个相邻边盒子之间的距离,在A或者B盒子上用margin控制,就可以控制距离了. 2:父子级之间的元素,常规文档流中,只要垂直外边距直接接触就会发生合并.比如在写header标签时,想移动he ...

  8. JacksonJson的使用

    JacksonJson是SpringMVC内置的json处理工具,其中有一个ObjectMapper类,可以方便的实现对json的处理: //对象转字符串 // json处理工具 private Ob ...

  9. IOS开发之——绘图(CGContext)

    0 CGContextRef context = UIGraphicsGetCurrentContext(); 设置上下文 1 CGContextMoveToPoint 开始画线 2 CGContex ...

  10. OpenStack kilo版(3) Nova部署

    部署在controller和compute节点 配置数据库 MariaDB [(none)]> CREATE DATABASE nova;  Query OK, 1 row affected ( ...