Закончил задачу джуна переписать на NGRX #105
Conversation
nurik-nuxt
changed the title
src/app/user-list/edit-user-dialog/edit-user-dialog.component.ts
Outdated
Show resolved
Hide resolved
src/app/app.component.ts
Outdated
|
|
||
| @Component({ | ||
| selector: 'app-root', | ||
| standalone: true, | ||
| imports: [RouterOutlet], | ||
| imports: [RouterOutlet, UserListComponent], |
There was a problem hiding this comment.
Корректное название для компоненты UsersListComponent, так как это список пользователей (множ. число)
src/app/services/users.service.ts
Outdated
|
|
||
| loadUser(): void { | ||
| this.usersApiService.getUsers() | ||
| .pipe(takeUntil(this.destroy$)) // Отписка при уничтожении |
| import { createSelector } from '@ngrx/store'; | ||
| import { User } from "../../types/user.types"; | ||
|
|
||
| interface UserState { |
There was a problem hiding this comment.
в файле users.selectors тип называется UserState?
Пользователи во множ.числе UsersState нужно
src/app/services/users.service.ts
Outdated
| providedIn: 'root' | ||
| }) | ||
| export class UsersService implements OnDestroy { | ||
| private userSubject = new BehaviorSubject<User[]>([]); |
There was a problem hiding this comment.
добавляйте readonly по надобности
inject рядом с inject
BehaviorSubject рядом с BehaviorSubject
src/app/services/users.service.ts
Outdated
| editUser(editedUser: User) { | ||
| const users = this.userSubject.value.map(user => | ||
| user.id === editedUser.id ? editedUser : user | ||
| ); |
There was a problem hiding this comment.
пустуй строку добавьте перед this.userSubject.next(users);, чтобы визуально отделить логику
src/app/services/users.service.ts
Outdated
| } | ||
|
|
||
| createUser(newUser: User) { | ||
| const users = [...this.userSubject.value, newUser]; |
There was a problem hiding this comment.
пустуй строку добавьте перед this.userSubject.next(users);чтобы визуально отделить логику
| import {Component} from "@angular/core"; | ||
| import {FormControl, FormGroup, ReactiveFormsModule, Validators} from "@angular/forms"; | ||
| import {NgIf} from "@angular/common"; | ||
| import {MatDialogClose} from "@angular/material/dialog"; |
There was a problem hiding this comment.
не сделано, установите prettier
| import {Component} from "@angular/core"; | ||
| import {FormControl, FormGroup, ReactiveFormsModule, Validators} from "@angular/forms"; | ||
| import {NgIf} from "@angular/common"; | ||
| import {MatDialogClose} from "@angular/material/dialog"; |
There was a problem hiding this comment.
https://youtu.be/__eiQumLOEo?si=wwTbSKNncaMelG-R видео по prettier
| }); | ||
|
|
||
| dialogRef.afterClosed().subscribe(editResult => { | ||
| if (!editResult) return; |
There was a problem hiding this comment.
если после return, есть код, то ставьте пустую строку
| }) | ||
|
|
||
| export class UsersListComponent { | ||
| public readonly store = inject(Store); |
There was a problem hiding this comment.
вы уверены что все 3 зависимости public? поставьте каждому private и если работает, оставьте private
| providedIn: 'root', | ||
| }) | ||
| export class UsersService implements OnDestroy { | ||
| private readonly userSubject = new BehaviorSubject<User[]>([]) |
There was a problem hiding this comment.
в названии для subject нужно добавлять $ это общепринятая практика, что бы указать визуально что это поток
telegram @nurtuganulyn