[NgRX] Update record in NgRX

Define an action to update the record:

import { createAction, props } from "@ngrx/store";
import { Update } from "@ngrx/entity";
import { Course } from "./model/course";

export const courseUpdated = createAction(
  "[Edit Course Dialog] Course Updated",
  props<{ update: Update<Course> }>()
);

It is using 'Update' type from NgRX.

 

Dispatch an action:

For 'Update' type we need to give 'id' & 'changes' props

  onSave() {
    const course: Course = {
      ...this.course,
      ...this.form.value
    };

    const update: Update<Course> = {
      id: course.id,
      changes: course
    };

    this.store.dispatch(courseUpdated({ update }));

    this.dialogRef.close();
  }