Angular 每秒增加物料进度条的值角度10

我希望每秒为进度条的值添加值，以便在进度条为100时执行一些操作。我已经写了下面的代码，但它没有做任何事情

Ts文件：

导出类ProgressSpinnerTest实现OnInit{
颜色：themepalete='primary'；
模式：ProgressSpinnerMode='确定'；
数值=0；
分：认购；
ngOnInit（）：void{
this.sub=间隔（1000）。订阅（x=>{
这是progressBar（）；
});
}
progressBar（）：无效{
该值为+10；
如果（this.value==100）{
控制台日志（“完成”）；
该值=0；
}
}
}

组成部分：

结果

---

如何使其每秒向进度条的值增加10？

您也可以使用rxjs运算符执行此操作：

  color: ThemePalette = 'primary';
  mode: ProgressSpinnerMode = 'determinate';
  progress: Observable<number>;
  ngOnInit(): void {
    this.progress = interval(1000).pipe(
      mapTo(10),
      scan((a, b) => a + b),
      takeWhile((value) => value < 100, true),
      map((value) => (value == 100 ? 0 : value))
    );
    this.progress.pipe(takeLast(1)).subscribe((_) => console.log('done'));
  }

color:themepalete='primary'；
模式：ProgressSpinnerMode='确定'；
进展：可见；
ngOnInit（）：void{
此.progress=间隔（1000）.管道(
马普托（10），
扫描（（a，b）=>a+b），
takeWhile（（值）=>值<100，为真），
映射（（值）=>（值==100？0:value））
);
this.progress.pipe（takeLast（1））.subscribe（（）=>console.log（'done'）；
}

以及html：

<mat-progress-bar 
  [color]="color"
  [mode]="mode"
  [value]="progress | async">
</mat-progress-bar>

---

最好避免在组件中使用订阅，让angular使用异步管道处理订阅。

this.value+10？这家公司应该做什么？应该是
this.value+=10？