无效的模板Kendo UI编号格式



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

<!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")

如果您不想要额外的格式化函数,则可以做这样的事情:

template :( dataitem)=> kendo.tostring(dataitem.num,'#,## 0.0000')

相关内容

  • 没有找到相关文章

最新更新