kmaraz

export const DELETE_EVENT = '[Events] DELETE_EVENT';
export const SELECT_EVENT = '[Events] SELECT_EVENT';
export const RESET = '[Events] RESET';

export class DeleteEvent implements Action {
  readonly type = DELETE_EVENT;
  constructor(public payload: PayloadEvent) { }
}

export class SelectEvent implements Action {

kmaraz

export function reducer(state: EventsState = initialState, action: Action): EventsState {
  switch (action.type) {
    case EventsActions.UPDATE: {
      // Clone the oridinal state to be sure, not to update the object reference
      const newState = cloneDeep(state);
      newState.events = action.payload;
      return newState;
    }
    case EventsActions.RESET: {
      return cloneDeep(initialState);

kmaraz

@Component({
  selector: 'events',
  templateUrl: './events.component.html'
})
export class EventsComponent implements OnDestroy, OnInit {

  events: Event[]; // Event list
  private eventsSub: Subscription;

  constructor(

kmaraz

// The original AngularJs application
const ngModule = angular.module('admin', [
  // We are leaving all the old module untouched
  'ng1.modules',
  // We can downgrade Components, Directives, Services, etc.
  // And use them in the AngularJs app
  'ng2.modules'
]);

@NgModule({

kmaraz

const path = require('path');
const AngularCompilerPlugin = require('@ngtools/webpack').AngularCompilerPlugin;

module.exports = (env, argv) => {

  const config = {
    plugins: [
      // See: https://www.npmjs.com/package/@ngtools/webpack
      new AngularCompilerPlugin({
        // We wanted to have separate tsconfig for AOT compilation

kmaraz

{
  "compilerOptions": {
    "baseUrl": "./",
    "target": "es5",
    "module": "esnext",
    "lib": ["es2018", "dom"],
    "moduleResolution": "node",
    "typeRoots": ["node_modules/@types"]
  },
  "exclude": ["app/main.aot.ts"]

kmaraz

{
  "compilerOptions": {
    "baseUrl": "./",
    "target": "es5",
    "module": "esnext",
    "lib": ["es2018", "dom"],
    "moduleResolution": "node",
    "typeRoots": ["node_modules/@types"]
  }
}

kmaraz

if (ON_DEVELOPMENT) {
  // We are loading version of app which uses JIT
  require('./app.module');
}
else {
  // Here we want to load a special entry file for AOT
  require('./main.aot');
}

kmaraz

import { platformBrowser } from '@angular/platform-browser';
 // This file will be available during the compilation
import { AppModuleNgFactory } from './app.module.ngfactory';

platformBrowser().bootstrapModuleFactory(AppModuleNgFactory);

kmaraz

// MUST BE IN THIS ORDER!
import 'core-js/es7/reflect';
import 'zone.js/dist/zone';

import { enableProdMode, NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
import { UpgradeModule } from '@angular/upgrade/static';
import * as angular from 'angular';