Угловые сигналы – использование mutate() и использование реактивности forEach()
Рассматривая следующий пример Angular Signals , я несколько озадачен тем, когда мне следует использовать API Signal, например mutate() и update() , когда API Array, например forEach , достаточно для запуска реактивности и обновления пользовательского интерфейса/шаблона. ? Какая здесь разница? Используемая угловая версия: 16.0.1
@Component({
selector: 'my-app',
standalone: true,
imports: [CommonModule],
template: `
{{usersList() | json}}
`,
})
export class App {
usersList: Signal<any> = inject(UserService).getUsersList();
constructor() {
}
}
bootstrapApplication(App);
@Injectable({
providedIn: 'root',
})
export class UserService {
private users = signal([
{ id: 1, name: 'Peter', country: 'USA' },
{ id: 2, name: 'Party Boy', country: 'USA' },
{ id: 3, name: 'John Connor', country: 'USA' },
]);
constructor() {
window.setTimeout(()=>{
this.changeUsersListWithoutMutate();
}, 3000),
window.setTimeout(()=>{
this.changeUsersListWithMutate();
}, 5000)
}
changeUsersListWithoutMutate(){
this.users().forEach((item) => {
if (item.id === 1) {
item.name = "changeListWithoutMutate";
}
});
}
changeUsersListWithMutate(){
this.users.mutate((data) => {
data.forEach((item) => {
if (item.id === 1) {
item.name = "changeListWithMutate";
}
});
});
}
getUsersList() {
return this.users;
}
}
1 ответ
То, что вы наблюдаете в своем примере, является стандартным обнаружением изменений, поскольку вы полагаетесь на
При этом вернемся к основам сигналов:
В
Вот почему
Дайте мне знать, если что-то неясно в моем ответе.