KandoUi的模板支持添加自定义样式么?

公司使用技术的速率还是可以的,虽然我都没用过,但尝试下还是好的,之前写页面都是angular+bootsrap,后来觉得开发效率太低,就让尝试着使用KendoUi,好吧,是没前端的什么事了哈;

最近使用kendo的grid表格,进行前台绑定数据,要使用到kendo中的template模板,然而,看完这个#号语法,依旧是有点懵逼,这不上来出个错搞了半天;

情景1. 使用grid制作了一个表格,帮数据的时候,发现字体图标太小,于是就在div里面添加样式,谁知道报错了

  • 未添加style之前
{   // 列头
    title:"",
    // 绑定的模板
    template:
     "# if(privilegeCategory == 'global'){#" +
     "
"+ "#}#" + "# if(privilegeCategory == 'tenant'){#" + "
"+ "#}#" + "# if(privilegeCategory == 'application'){#" + "
"+ "#}#", // 宽度,默认px,也可以使用百分比 width:40 }
  • 效果图,图标太小:


    KandoUi的模板支持添加自定义样式么?_第1张图片
  • 给父标签添加样式,调整字体大小:

 style='font-size:20px; text-align:center; color:#C67A62; padding:5px'

情景2:添加style之后, 前台报错,无效的模板!

KandoUi的模板支持添加自定义样式么?_第2张图片

情景3: 想法:

3.1我就添加了样式之后就报了错,当时脑子里飘出来几个字:麻蛋的,不会模板不让初始化样式把

然后上网上搜,然而并没有出现过这种问题,百思不得其姐;

3.2 搞了好一会,突然发现自己加的颜色,自带#字符,这特么不是坑爹么?

看到color: #82AF6F 我突然有种兴奋的感觉,好了问题就在这里了;

template 支持# 号语法,支持HTML+JS模板,但是如果模板中出现#字符,一定要记得转义,不然会报无效模板的错误;
KandoUi的模板支持添加自定义样式么?_第3张图片
使用双斜杠\\转义,单斜杠会与其他的#匹配,依旧报错
KandoUi的模板支持添加自定义样式么?_第4张图片
转义后:
KandoUi的模板支持添加自定义样式么?_第5张图片
前台页面显示正常,ok,问题解决;

你可能感兴趣的:(KandoUi的模板支持添加自定义样式么?)