Kendo ui 剑道下拉列表在选项中保留空白

我正在为JQuery/AngularJS使用剑道UI

我定义了以下

控件：

                            <select
                                kendo-drop-down-list
                               k-options="myOptions">
                            </select>

这应与一组选项相对应，如以下所示：

<option value="1">Accounting</option>
<option value="2">    Accounts Payable</option>
<option value="3">    Accounts Receivable</option>

我需要在选项中表示层次结构的多个级别。我觉得最好的方法是使用Javascript动态创建一个

部分，但它不起作用

function indent(spaceCount) {
    return ' '.repeat(spaceCount);
}

$scope.options = {
    dataTextField: 'TEXT',
    dataValueField: 'VALUE',
    template: function(dataItem) {
        return kendo.template(indent(dataItem.spaces -1) *4) + '#: DESCRIPTION #')(dataItem);
    },
    dataSource: {
        transport: {
            read: {
                // read definition
            },
            // needed to send JSON parameters to the query
            parameterMap: function(data, type) {
               const req = {
                   'QUERY_ID': $scope.queryId
               };
               return JSON.stringify(req);
            }
        },
        schema: {
            type: 'json',
            data: 'resultData'
        }
    }
};

---

有人能帮我吗？

我最后动态计算表示层次结构所需的空白量，然后为每个空间添加

（空间数是远程服务调用返回的参数）：

---

缩进函数可以内联完成。这也可能被重构为AngularJS服务。

为什么在名称前用“”表示层次结构？你是在尝试做类似的事情还是我遗漏了什么？你可以通过CSS保留空白：@Kevin我需要一个在选择框中表示的层次结构，作为某人选择值的视觉提示。

                $scope.myOptions = {
                    autoWidth: true,
                    autoBind: false,
                    dataTextField: 'TEXT',
                    dataValueField: 'VALUE',
                    dataSource: {
                        transport: {
                            read: {
                                url: urlToREST,
                                dataType: 'json',
                                type: 'POST',
                                contentType: "application/json"
                            },
                            // needed to send params as JSON
                            parameterMap: function (data, type) {
                                const req = {
                                    "QUERY_ID": $scope.queryId
                                };

                                return JSON.stringify(req);

                            }
                        },

                        schema: {
                            type: "json",
                           data: "resultData"
                        }

                    }
                };

function indent(spaceCount) {
    return ' '.repeat(spaceCount);
}

$scope.options = {
    dataTextField: 'TEXT',
    dataValueField: 'VALUE',
    template: function(dataItem) {
        return kendo.template(indent(dataItem.spaces -1) *4) + '#: DESCRIPTION #')(dataItem);
    },
    dataSource: {
        transport: {
            read: {
                // read definition
            },
            // needed to send JSON parameters to the query
            parameterMap: function(data, type) {
               const req = {
                   'QUERY_ID': $scope.queryId
               };
               return JSON.stringify(req);
            }
        },
        schema: {
            type: 'json',
            data: 'resultData'
        }
    }
};