For Angular Usage - Add a method in Six ProgressBar and Six ProgressBar to let update percent value by typescript.

[francoflores]

What problem does this feature solve?

Currently the way to set the percent value of one of those components is as follow:

<six-progress-ring percentage="50"></six-progress-ring>

There isn't problem with that, however if the value is change by some event controller by service or stream, the only way to update that value is as follow:

<six-progress-ring percentage="{{getCurrentPercentValue()}}"></six-progress-ring>

And that way the performance decrease.

For that reason, I suggest to add a method to those components to let update percent value from typescript.

What does the proposed API look like?

How we use currently:

<six-progress-ring percentage="{{getCurrentPercentValue()}}"></six-progress-ring>

How I suggest to use with the recomendation:

<six-progress-ring percentage="0"></six-progress-ring>

In TypeScript:

@input(SixProgressRing) progressRing: SixProgressRing;

....
// Some control event activated
this.progressRing.percent = value //(0-100)
....