![](/img/trans.png)
[英]Kendo Angular - How to get data on the doubleClick event on Kendo Grid?
[英]How to get Kendo grid to color currency
我希望此网格列字段中的所有负值都显示为红色,而所有正值都显示为绿色。 这段代码用于columns对象数组:
{ field: "Amount", title: "Balance", format: "{0:c}", attributes: { style: "text-align: right;" }, template: "<font class='#if(Amount < 0) {# negative_field #} else {# positive_field #}'></font>" },
CSS
.negative_field {
color: red;
}
.positive_field {
color: green;
}
您的模板中存在语法错误:
template: "<font class='#if(Amount < 0) {# negative_field #} else {# positive_field #}'></font>"
Hash(#) should be closes here ^
在font
标签内,您应该显示属性:
<font...>#= Acount #</font>
但是,而不是使用font
,使用div
和删除format
从列属性使用kendo.toString(Acount, 'c')
您的模板中:
template: "<div class='currency # if(Amount < 0) {#negative_field# } else { #positive_field# } #'>#=kendo.toString(Amount, 'c') #</div>"
您还可以从列中删除attributes
,而仅使用css:
.currency {
text-align: right;
}
您可以这样做:
剑道网格columns
:
{ field: "Amount", title: "Balance", attributes: { style: "text-align: right;" }, template: function (e) { return format_currency(e, "Amount"); } },
使用Javascript:
var currency = new Intl.NumberFormat('en-US', {
style: 'currency',
currency: 'USD',
minimumFractionDigits: 2,
});
function format_currency(e, property) {
if (e[property] < 0) {
return "<span class='negative_field'>" + currency.format(e[property]) + "</span>";
}
else if (e[property] === 0) {
return "<span class='include_spaces'>$ - </span>";
}
else {
return "<span class='positive_field'>" + currency.format(e[property]) + "</span>";
}
};
CSS:
.negative_field {
color: red;
}
.positive_field {
color: green;
}
.include_spaces {
white-space: pre;
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.