当前位置: 首页 > 知识库问答 >
问题:

KnockoutJS和嵌套可排序列表(二维)

林烨烨
2023-03-14

我正在寻找一种在KnockoutJS中实现简单嵌套/可嵌套树结构的方法;它应该只允许两个级别。

到目前为止,我发现了这个(以及在SO上的一系列非常相似的方法): Knockout.js嵌套的可排序绑定

然而,在这个例子和其他例子中,“容器”不能成为“孩子”,反之亦然。

基本上,我正在寻找这样的结构:http://jsfiddle.net/uhVAW/2/

也就是说,它最终将呈现一个具有两个级别的列表:父类别和其子类别。

我在Knockout ViewModel中的树结构采用以下形状(没有所有更新逻辑):

 var VM = function(cats)
 {
    this.categories = ko.observableArray(cats); // bound to the list
 }

 var Category = function
 {
    this.name = ko.observable();
    this.children = ko.observableArray([]); // if exists (i.e. if the cat is a parent), this is bound to a list within the <li>
 }

因此,本质上:

  1. 排序父级
  2. 在父母内部对孩子进行排序
  3. 孩子可以成为父母

干杯

共有1个答案

易阳朔
2023-03-14

下面是一个简单的树视图,使用递归模板进行敲除排序:http://jsfiddle.net/rniemeyer/Lqttf/

视图模型看起来就像:

var TreeItem = function(name, children) {
   this.name = ko.observable(name);
   this.children = children && ko.observableArray(children);
};

ko.applyBindings({
    root: new TreeItem("root", [
       new TreeItem("A", [
          new TreeItem("A1"),
          new TreeItem("A2")
       ]),
       new TreeItem("B", [
          new TreeItem("B1"),
          new TreeItem("B2")
       ])
    ])
});

该视图看起来像:

<script id="nodeTmpl" type="text/html">
    <li>
        <a href="#" data-bind="text: name"></a>
        <div data-bind="if: children">
           <ul data-bind="sortable: { template: 'nodeTmpl', data: $data.children }"></ul>            
        </div>
    </li>
</script>

<ul data-bind="template: { name: 'nodeTmpl', data: root }"></ul>
 类似资料:
  • 问题内容: 我有类似的东西 并且需要具有: 非常感谢! 编辑:我想按subkey1进行排序,这之前还不清楚。 问题答案: 使用关键字表示功能和方法: 演示: 假定 所有 顶级词典都具有一个键,该键被假定为带有键的字典。 有关更多详细信息和技巧,请参见Python Sorting HOWTO 。

  • 问题内容: 我想获取x在嵌套列表中出现的次数。 如果列表是: 还行吧。但是如果列表是: 如何获得1出现的次数?在这种情况下,4。 问题答案: 这是扁平化嵌套序列的另一种方法。将序列展平后,可以很容易地进行检查以找到项目数。 上面的代码打印:

  • 问题内容: 我具有以下数据结构(列表列表) 我希望能够 使用函数对列表重新排序,以便我可以按列表中的每个项目分组。例如,我希望能够按第二列分组(以便所有21列在一起) 使用函数仅显示每个内部列表中的某些值。例如,我想减少此列表,使其仅包含“ 2somename”的第四个字段值 所以列表看起来像这样 问题答案: 对于第一个问题,您应该做的第一件事是使用运算符模块中的itemgetter按第二个字段对

  • 问题内容: 我正在尝试在Elasticsearch中进行嵌套排序,但到目前为止没有成功。 我的数据结构: 我想根据文档中第一作者的姓氏对文档进行排序。 使用的映射: 使用SearchRequestBuilder(JAVA)进行排序: 这行得通,但没有给出想要的结果(例如,首先是“叫卖”,然后是“罗杰”)。 我错过了什么吗?有没有办法表明Elasticsearch访问数组authorList的ind

  • 我试图在Elasticsearch中进行嵌套排序,但到目前为止还没有成功。 我的数据结构: 我想根据文档中第一作者的姓氏对文档进行排序。 使用SearchRequestBuilder(JAVA)进行排序: 这是有效的,但不能给出想要的结果(例如,首先是“霍金”,然后是“罗杰”)。 我是不是漏掉了什么?是否有一种方法可以指示Elasticsearch访问数组authorlist的index=0?是否

  • 我正在创建一个具有嵌套列表的API。Jackson似乎是一个创建对象的好工具,但我不太清楚如何嵌套列表,我想知道这是否可能。 我的对象看起来像这样。 我希望有一种方法可以将其映射到json,看起来像: 我们希望能够做到这一点,以便我们可以将属性添加到列表中。