I have one controller in angularJs(1.6) which is using ui-grid. Problem is there is one cell template. I want to get different values for rating percentage in this template. I have created a function "getRating()" and called it. But it gets called only one time. Hence I get the same value for all the template.
Could anyone please help me with this?
Here is my controller code:
(function () {
'use strict';
define([
'angular'
], function (angular) {
function SelectToolController($scope, $timeout, $filter, uiGridConstants) {
var vm = this,
_gridApi,
_cellTemplate,
_columnDefs,
_starRatingTemplate,
_starRatingColumn,
_starEnable;
};
_starRatingTemplate = [
'<div class="opr-star-rating" >',
'<opr-star-rating rating-percentage="'+getRating()+'">',
'</opr-star-rating>',
'</div>'
].join('');
vm.rating = 10;
//this func is called from _starRatingTemplate
vm.getRating = function(){
return vm.rating++;
}
});
As you can see I am incrementing the value everytime the function getRating is called. But this function is called only one time. So I end up getting value 11 for all the cells in my grid.
The template string is "calculated" once and used in each cell, so the call to
getRating()
is made only once, when building the template string.To make a call to the function each time, you should use the 'mustache'
{{}}
and reference your controller.So your code should be similar to this: