1

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

<!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") 中传递格式,而不是编写单独的函数

4

1 回答 1

3

如果您不想要额外的格式化功能,您可以这样做:

模板:(dataItem) => kendo.toString(dataItem.Num, '#,##0.0000')

于 2019-03-11T19:13:05.457 回答