Issue
I have a CSS property value pair something like this:
style="width:60%"
This works fine. But when I try to concat something like this inside of ng-repeat:
<tbody ng-show="!vm.loading">
<tr ng-repeat="item in vm.currentBatches.items | orderBy: vm.sortBy.current_batch">
<td class="table-text" ng-show="!item.showRefreshForApiLoading">
<div class="progress progress-medium" ng-show="item.batch_status==='in progress'">
<div class="progress-inner">
<div class="segment" style="'width: "+item.succeeded_time_pct+"%">
<div class="bar status-ok bar-striped"></div>
</div>
</div>
</div>
<span class="progress-label status-ok" ng-show="item.batch_status==='in progress' && item.progressFlag !== 'NA'">In Progress</span>
Why does this not work ?
style="width: "+item.succeeded_time_pct+"%">
This says CSS property value expected
,
What am I doing wrong?
Solution
You can fix it using:
<div class="segment" ng-style="{'width': item.succeeded_time_pct + '%' }">
ng-style is a directive which angular offers to apply style properties dynamically
Ref: https://docs.angularjs.org/api/ng/directive/ngClass
Answered By - gauravmuk
0 comments:
Post a Comment
Note: Only a member of this blog may post a comment.