Угловые сигналы – использование 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 ответ

То, что вы наблюдаете в своем примере, является стандартным обнаружением изменений, поскольку вы полагаетесь на.

это один из API, исправленныхэто означает, что каждый раз, когда он вызывается, Angular запускает цикл обнаружения изменений и обновляет ваш DOM. Поскольку значение, заключенное в сигнал, было изменено (независимо от того, каким образом), новое значение появится в DOM.

При этом вернемся к основам сигналов:

В, вы не обновляете сигнал, потому что считываете его значение и изменяете его вложенные значения. Сам сигнал не может узнать, что он обновлен.

Вот почемуэто путь. Вы явно сообщаете сигналу, что обновляете его значение, и сигнал запускает обнаружение изменений.

Дайте мне знать, если что-то неясно в моем ответе.

Другие вопросы по тегам