Progress Bar does not work properly with dynamic max value

[naveensky]

When we bind max value to a function or property which can update on runtime, the progress bar doesnt work as expected.

Plunk to get started
http://plnkr.co/edit/goYLZQMnipkMGms45lux?p=preview

[chrisirhc]

I think you missed calling the function max="max()".
http://plnkr.co/edit/0SboxqydYDC9NHPuAEKF?p=preview

Cool example, by the way. :)

[naveensky]

:) Thanks but I got a better example ;)

If you do not update the value of bar and only update the max value for the bar, the progress bar doesnt work. I updated your example for this particular use case

http://plnkr.co/edit/h0SVT6wgsyj5hXCuLoon?p=preview

The issue lies in the directive. We are only watching the value field of the progress bar and not the max value. So even though max values is updated, the new updated percentage doesnt reflect on the UI.

[chrisirhc]

You're right, the max is not re-evaluated on each update.

We're in the middle of discussing and re-considering the need to add more watchers for these edge cases. From the top of my head and in my opinion, it's rare that the max would change in the case of a progressbar after initialization.

We're being conservative on adding watchers as this very quickly heavily impacts the performance of AngularJS applications.

As such, the new approach by this project (we'll need more discussion) might be to give users the ability to watchers on attributes that we don't intend to add watchers for. This is likely done through exposing these attributes through the controller.

[naveensky]

I can understand the performance pitfalls of multiple watchers. Having custom watches might be interesting, looking forward to it.

[c0d3rm0nk3y]

First time github user, hope i'm in the right spot.. I can't seem to get the progress bar to show up at all. I'm building a chrome app and using angularjs and this amazing boostrap.. not sure if i'm doing something wrong. I've copy/pasted all of the examples available.

[Foxandxss]

@c0d3rm0nk3y That kind of support is better on the IRC (#angularjs at freenode).

[c0d3rm0nk3y]

@Foxandxss thanks for the tip.

Is there any way to reinitialise the maximal value? I will need this only once because the needed data will come asynchronously.

[johnnyaug]

I also ran into this problem. As a workaround, you can leave the max as a constant (say, 100) and take it into accout on the value.
For example:
<progressbar value="( value * 100 ) / max", max="100")>

[naveensky]

@johnnyaug pretty slick. I got a working example at http://plnkr.co/edit/P6BD30WL8OK0Pfk1RsVL?p=preview

[croomes]

Wish I'd thought of that! Instead I applied the patch from @bekos and it's working well.

[gsugiart]

@johnnyaug I wish I see your solution sooner it would have saved me almost a day worth of works and tons of frustration. Thanks.

[ismarslomic]

@johnnyaug thank you so much. I was literally hitting my head against the wall understanding why my bar was not changing.. Your solution worked perfectly.