ng-state
  • Introduction
  • Main differences
  • Getting Started
    • Instalation
    • Examples
  • Core concepts
    • Main idea
      • More complex flow visualization
    • Configuration
      • Immer Setup
      • ImmutableJs Setup
    • Store
      • Operators
      • Optimistic updates plugin
      • Optimistic updates plugin
      • Form manager plugin
        • onChange hook
        • shouldUpdateState hook
        • Custom form elements
      • Persist state plugin
        • Configuring custom storage
    • Actions
      • Immer
      • ImmutaleJs
      • Injectable Actions
    • Components with Actions
      • Signal Actions
      • State Actions
    • @InjectStore decorator
    • @WithStore decorator
    • @ComponentState decorator
    • Dispatcher
  • Different scenarios
    • Passing list item index via router
    • ngOnChanges hook
    • FormManager pitfalls
  • Unit testing
    • Setup
    • Test store
    • Test actions
    • Test component with actions
    • Test with Angular TestBed
  • Debugging
    • Setup
    • Redux DevTools
    • Automated changes output
    • Manual state changes check
    • Additional debugging information
  • Production
    • Production mode
    • Server Side Rendering (SSR)
  • Other information
    • Best practices
    • CLI
      • Custom Configurations
    • Performance
    • Blog Posts
    • Contributing
Powered by GitBook
On this page

Was this helpful?

  1. Debugging

Setup

PreviousTest with Angular TestBedNextRedux DevTools

Last updated 6 years ago

Was this helpful?

Debugging is disabled by default and can be invoked via console see more on

Debugger setup

However, often there are cases, when you need to track whole state change history from very start for example initial data load etc. For this case you can enable it on app initialization:

StoreModule.provideStore(initialState, false, {
    debugger: {
        enableInitialDebugging: true,
        options: ...
    }
})

As you can see there are more options:

  • enableConsoleOutput - toggle output changes to console or not: Default: true

  • enableDevToolsOutput - toggle output changes to Redux DevTools or not. Default: true

History options

ng-state keeps 100 latest history items by default. It can be useful when you want to send some logs for further investigation. You can disable or increase stored items by overriding default parameters by invoking changeHistoryDefaultOptions

StoreModule.provideStore(initialState, false, {
    history: {
        collectHistory: true,
        storeHistoryItems: 10
    }
})

it has such options:

  • storeHistoryItems - number of items to store. Default: 100

  • collectHistory - enable or disable history collecting. Deafult: true

Automated Changes Output