CODEWITHSUNDEEP
javascriptangularjsangular-ui-grid
smart987
smart987

Reputation: 832

Angularjs ui grid dynamic cell template value

In angularjs ui grid, I have the cell template as shown below :

cellTemplate: " <div class="progress"> <div class="progress-bar progress-bar-info" style="width: 20%"></div> </div>"

Now I need to dynamically set width percentage( style="width: 20%") based on cell value, it could be 30% or 40% or 53%, etc. How can we make it dynamic using row.entity.status? status is my column.

Upvotes: 2

Views: 1288

Answers (1)

Rishabh
Rishabh

Reputation: 1213

Angular provide very useful directive called ng-style

ng-style="{width:'{{dynamicValue}}%'}"

In this case

cellTemplate: ' <div class="progress"> <div class="progress-bar progress-bar-info" ng-style="{width:'{{dynamicValue}}%'}"></div> </div>'

Upvotes: 1

Related Questions