Question

格式化模板的正确方法是什么：

<!DOCTYPE html>
<html>
  <head>
    <base href="https://demos.telerik.com/kendo-ui/treelist/local-data-binding">
    <style>html { font-size: 14px; font-family: Arial, Helvetica, sans-serif; }</style>
    <title></title>
    <link rel="stylesheet" href="https://kendo.cdn.telerik.com/2019.1.220/styles/kendo.common-material.min.css" />
    <link rel="stylesheet" href="https://kendo.cdn.telerik.com/2019.1.220/styles/kendo.material.min.css" />
    <link rel="stylesheet" href="https://kendo.cdn.telerik.com/2019.1.220/styles/kendo.material.mobile.min.css" />

    <script src="https://kendo.cdn.telerik.com/2019.1.220/js/jquery.min.js"></script>
    <script src="https://kendo.cdn.telerik.com/2019.1.220/js/kendo.all.min.js"></script>


  </head>
  <body>
    <div id="example">
      <div id="treelist"></div>

      <script>
        $(document).ready(function () {
          var dataSource = new kendo.data.TreeListDataSource({
            data: [
              { id: 1, Name: "Daryl Sweeney", Position: "CEO", Num: 555757843457.65, parentId: null },
              { id: 2, Name: "Guy Wooten", Position: "Chief Technical Officer", Num: 555757843457.66889, parentId: 1 },
              { id: 32, Name: "Buffy Weber", Position: "VP, Engineering", Num:555757843457.86868, parentId: 2 },
              { id: 11, Name: "Hyacinth Hood", Position: "Team Lead", Num: 555757843457.58686, parentId: 32 },
              { id: 60, Name: "Akeem Carr", Position: "Junior Software Developer", Num: 555757843457.566456, parentId: 11 },
              { id: 78, Name: "Rinah Simon", Position: "Software Developer", Num:555757843457.88567567, parentId: 11 },

            ],

            schema: {
              model: {
                id: "id",
                expanded: true,
                fields: {
                  Num: {type: "number",

                       parse: function(value) {
                    return  kendo.parseFloat(kendo.toString(value,"#,##0.0000"));  
                  }
                       }
                }
              }
            }
          });

          $("#treelist").kendoTreeList({
            dataSource: dataSource,
            height: 540,
            filterable: true,
            columns: [
              { field: "Position" },
              { field: "Name" },
              { field: "Num",template: '#= formatNm(Num) #',
                filterable: {
                                ui: function (element) {
                 element.kendoNumericTextBox({

                                decimals: getDecimals("#,##0.0000")
                 });
             }
        }
              }
            ]
          });
        });

        //\#,\#\#0.00
        function formatNm(Num,val){
          console.log('Num---',Num)
        if (Num)
          return kendo.toString(Num, "#,##0.0000");
          else
            return '';
        }
      function getDecimals(format){
    return format.split('.')[1].split('').length;
  }

      </script>
    </div>


  </body>
</html>

它在Jquery中有效。我正在.ts文件中实现相同的功能。

有代替模板：'＃= formatNm（Num）＃'我正在写this.formatNum，但是它在数据可用之前就被触发了

任何想法我们如何实现这一目标。

或者我没有写单独的函数，而直接在kendo.toString（'Num'，“＃，## 0.0000”）

中传递格式

Answer 1

如果您不需要额外的格式化功能，可以执行以下操作：

模板：（dataItem）=> kendo.toString（dataItem.Num，'＃，## 0.0000'）

无效的模板剑道用户界面编号格式

1 个答案: