Process status indicator in action
The ProgressBar component indicates a status of some process, task, or whatever. It can deal with static as well as dynamic values. A dynamic value is a value changing in time. The next code snippet demonstrates two progress bars, with a static and dynamic value:
<p-growl [value]="msgs"></p-growl> <h3>Static value</h3> <p-progressBar [value]="40"></p-progressBar> <h3>Dynamic value</h3> <p-progressBar [value]="value"></p-progressBar>
The dynamic value gets produced every 800 milliseconds from 1 to 100 with the Observable
methods as follows:
export class ProgressBarComponent implements OnInit, OnDestroy { msgs: Message[]; value: number; interval$: Subscription; ngOnInit() { const interval = Observable.interval(800).take(100); this.interval$ = interval.subscribe( x => this.value = x + 1, () => {/** no error handling */ }, () => this.msgs = [{severity: 'info...