Boolean в Angular Сервис не работает должным образом - PullRequest
1 голос
/ 23 апреля 2020

В основном у меня есть логический canSiteReload в моем сервисе, основанный на другом логическом hasChanges в том же сервисе.

Сервис выглядит следующим образом:

@Injectable({
  providedIn: 'root'
})
export class ApplicationService {

  constructor() { }

  public hasChanges: boolean = false;
  public canSiteReload: boolean = this.hasChanges === false;
}

Проблема если при изменении hasChanges на true canSiteReload все равно вернет true, даже если this.hasChanges === false должно вернуть false, поскольку hasChanges теперь верно.

Почему это происходит и как это можно сделать Я делаю canSiteReload значение на основе hasChanges? Если возможно, я хочу избежать дополнительного кода, например, без функций / установщиков.

Воспроизводитель: https://stackblitz.com/edit/angular-rwcza8

Ответы [ 3 ]

1 голос
/ 23 апреля 2020

Переменная canSiteReload определяется один раз в начале ApplicationService и никогда больше не обновляется. Есть несколько способов достичь ваших требований. Вот один метод, использующий Rx js BehaviorSubject.

Служба приложений

import { Injectable } from '@angular/core';
import { BehaviorSubject, Observable } from 'rxjs';

@Injectable({
  providedIn: 'root'
})
export class ApplicationService {
  private hasChangesSource = new BehaviorSubject<boolean>(false);
  private hasChanges$ = this.hasChangesSource.asObservable();

  public canSiteReload: boolean;

  constructor() {
    this.hasChanges$.subscribe(status => this.canSiteReload = !status);
  }

  get hasChanges() {
    return this.hasChangesSource.value;
  }

  set hasChanges(status: boolean) {
    this.hasChangesSource.next(status);
  }
}

Я изменил ваш Stackblitz .

1 голос
/ 23 апреля 2020

Согласен с комментарием @ Дэвида. Без функции записи canSiteReload, похоже, не обновляется.

Я разветвил и изменил следующую часть:

this.appService.hasChanges = false;

Я создал функцию в службе и обновил значение, используя эту функцию , Вот так:

public change(): void{
  this.appService.saveChanges(true);
  console.log('Has changes?: ', this.appService.hasChanges);
  console.log('Can site reload?: ', this.appService.canSiteReload);
}

public undo(): void{
  this.appService.saveChanges(false);
  console.log('Has changes?: ', this.appService.hasChanges);
  console.log('Can site reload?: ', this.appService.canSiteReload);
}

и это работает, я думаю.

Разветвлённо: https://stackblitz.com/edit/angular-aeyxgg

0 голосов
/ 23 апреля 2020

Как сказал Дэвид, canSiteReload инициализируется, но его значение никогда не обновляется.

canSiteReload не обновляется, даже когда значение hasChanges было обновлено до true.

Чтобы исправить, нам нужно добавить геттер для canSiteReload:

@Injectable({
  providedIn: 'root'
})
export class ApplicationService {

  constructor() { }

  public hasChanges: boolean = false;
  public get canSiteReload(): boolean{
    return !this.hasChanges
  }
}

canSiteReload теперь оценивается при каждом вызове.

Дополнительные условия могут быть добавлены после !this.hasChanges.

https://stackblitz.com/edit/angular-z3uyqw

...