user-ngxs.example.ts

interface UserModel {
  id: number | null;
  username: string | null;
  age: number | null;
}

export class UserSetAction {
  public static type: string = '[UserSetAction]: action';
  constructor(public payload: UserModel) {}
}

export class UserResetAction {
   public static type: string = '[UserResetAction]: action';
}

@State<UserModel>({
  name: 'userInfo',
  defaults: {
    id: null,
    username: null,
    age: null
  }
})
@Injectable()
export class UserInfoState {
  @Action(UserSetAction)
  public set(ctx: UserAction, { payload }: UserSetAction) {
    ctx.setState(payload);
  }
  
  @Acton(UserResetAction)
  public reset(ctx: UserResetAction) {
    ctx.reset({ id: null, username: null, age: null });
  }
}

@Component()
export class UserComponent {
  constructor(private store: Store, private userApi: UserService) {
  }
  
  public ngOnInit(): void {
    this.userApi.load().subscribe((user: UserModel) => {
      this.store.dispatch(new UserSetAction(user));
    });
  }
  
  public ngOnDestroy() {
    this.store.dispatch(new UserResetAction());
  }
}