import { Injectable } from '@angular/core';
import { InitialState, Store, Reducer } from 'a4-store';
 
interface State {
  data1: number;
  data2: number;
}
 
@InitialState<State>({
  data1: 123,
  data2: 9995
})
@Injectable({
  providedIn: 'root'
})
export class AppStore extends Store<State> {
 
  @Reducer()
  setData1(data: number): Partial<State> {
    return { data1: data };
  }
 
  @Reducer()
  setData2(data: number): Partial<State> {
    return { data2: data };
  }
 
}

import { Component, OnInit, OnDestroy } from '@angular/core';
import { AppStore } from './app.store';
import { Observable, Subscription } from 'rxjs';
 
@Component({
  selector: 'app-my-sample',
  templateUrl: './my-sample.component.html',
  styleUrls: ['./my-sample.component.css']
})
export class MySampleComponent implements OnInit, OnDestroy {
 
  data1: Observable<number>;
  data2: Observable<number>;
  subscriptions: Subscription[];
 
  constructor(private appStore: AppStore) {
    this.data1 = appStore.map(p => p.data1);
    this.data2 = appStore.map(p => p.data2);
  }
 
  ngOnInit() {
    this.subscriptions = [
      this.data1.subscribe(p => console.log(`Data 1 changes to ${p}`)),
      this.data2.subscribe(p => console.log(`Data 2 changes to ${p}`))
    ];
  }
 
  ngOnDestroy() {
    this.subscriptions.forEach(p => p.unsubscribe());
  }
 
  doClick() {
    this.appStore.setData1(this.appStore.state.data1 + 1);
    this.appStore.setData2(this.appStore.state.data2 - 1);
  }
 
}

immutableReplaceElement<T>(array: T[], newElement: T, index: number): T[]

immutableRemoveElement<T>(array: T[], index: number): T[]

immutableInsertElement<T>(array: T[], element: T, index: number): T[]

immutablePrependElement<T>(array: T[], element: T): T[]