Util functions and classes for angular2 projects. Used at DCS Fürth


0.15.04 years ago5 years agoMinified + gzip package size for @dcs/angular2-utils in KB



Angular2 tools and infrastructure used at DCS Fürth.

This is a companion libary for our Angular2 starter project (currently not public).

Table of Contents


In your Angular2 + TypeScript project:

npm install --save @dcs/angular2-utils immutable @angular2-redux/store redux-immutable redux-logger redux-observable

The other peer dependencies (@angular/core, rxjs ...) should already be there. It is an Angular2 project after all.

In the Root NgModule add Angular2UtilsModule to imports and inherit from MainBaseModule:

import { NgModule } from '@angular/core';
import { Angular2UtilsModule, MainBaseModule } from '@dcs/angular2-utils';

  /* ... */
  imports: [ /* ... */, Angular2UtilsModule ]
export class MainModule extends MainBaseModule { }

This does all the redux, DevTools, HMR ... wiring for the application.


  • Pre-wired redux store via @angular2-redux/store
  • Add reducers and epics via Angular DI
  • Many ready to use validator functions
  • Some basic reusable Components and Pipes
  • RestService as a small configurable wrapper around Angular2 Http service
  • Lots of small utility functions (see utils folder)

Root Reducer

To add a new reducer to the Root Reducer, we use Angular DI.

Provide a new reducer for the token APP_REDUCERS, using { multi: true }:

import { NgModule } from '@angular/core';
import { APP_REDUCERS } from '@dcs/angular2-utils';

import { myReducer } from './my.reducer';

  providers: [
    { provide: APP_REDUCERS, useValue: { name: 'keyInState', reducer: myReducer } }
export class FeatureModule { }

Routing via actions

Routing can be triggered via a Redux Action. Just inject RouterActions and dispatch the Action function routeChange.

The state below ['router', 'url'] also updates automatically when the route changes in app, even when not using the Action.

If you find any bugs or have a feature request, please open an issue on github!

The npm package download data comes from npm's download counts api and package details come from npms.io.