индикатор выполнения не обновляет угловой

Question

Предположим, у меня есть компонент html, где находится мой html мой индикатор выполнения

 <round-progress #progress
    [current]="current"
</round-progress>

Текущее значение в процентах.В моем компоненте ts я делаю:

    this.percentageSubscription=this.percentageService.percentage$.subscribe((percentage)=>{

          this.current=this.current+percentage;
console.log(this.current);

        });

правильное значение, которое я печатаю.Это увеличение по другому алгоритму.Console.log показывает правильное увеличение, но мое процентное значение не увеличивается в индикаторе выполнения.Кто-нибудь может мне помочь?

Answer 1

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

Я бы предложил использовать async трубу.И, таким образом, переписав свое использование:

<round-progress #progress
    [current]="current$ | async"
</round-progress>

И:

this.current$ = this.percentageService.percentage$.pipe(
  scan((acc = 0, percentage) => acc + percentage)    
);

В качестве бонуса вам больше не нужно управлять своей подпиской.Если вам локально нужен «текущий» для других целей, вы можете либо поделиться наблюдаемой (и снова управлять подписками), либо добавить сигнал, который устанавливает локальное значение.