删除元素

时间:2017-12-05 20:10:47

标签: javascript ajax knockout.js data-binding

之前我遇到过这种问题,当我写这篇文章时,解决方案'点击了'给我,但现在却让我望而却步。 Knockout.js的可观察数组赢了;当模型更新时删除数据...(使用映射插件)。

即,我有一个使用的视图模型:

var model = knockout.mapping.fromJS(Data, {}, ko.mapping.fromJS({}))

每当我从服务器获得AJAX响应时,我运行以下代码:

knockout.mapping.fromJS(Data, {}, model);

(它本质上是对相同函数的调用,但是如果没有定义model,它会根据空对象创建一个 - 意思是第一次被触发 - 每隔一次,它假设为< strong>更新模型。

然后使用以下方法将模型应用于HTML:

ko.applyBindings(model, document.getElementById('idhere'));

现在我得到的任何新数据都被正确绑定,任何景观变化,例如从一个模型结构移动到另一个模型结构,就像一个魅力....但是当我尝试更新现有的在以下情况下,具有来自服务器的新数据集的模型中的可观察数组:

  1. 添加新数据,数组会更新,我可以在模型中看到它。
  2. 更改其中一个元素的数据也有效,模型会更新。
  3. 但是,从数组中删除数据会将删除的数据留在模型中。
  4. 此外,#3仅在我删除除数组中最后一个元素之外的任何内容时发生。数组的最后一个元素被删除就好了没有任何问题,所以它就好像我只能“删除最后一个元素”。如果我删除了除最后一个元素之外的所有元素,那么在“更新”之后它们仍然在模型中
  5. 我觉得好像淘汰赛并不知道我希望删除这些元素所以当它看到它们消失时它并没有“更新”这些变化,认为我只想“添加更多元素”,其中没有AJAX只带回了一个缩小的列表(与我的客户端相比)。

    修改

    根据请求,HTML与所述可观察数组的绑定有关:

    <!-- ko foreach: model.dataSets.RoomsInSuite -->
    <span data-bind="text: Name"></span>
    <!-- /ko -->
    

    数组本身包含以下对象:

    RoomsInSuite = [
    {Name: "Room1", Type: "Bedroom"},
    {Name: "Room2", Type: "Kitchen"},
    {Name: "Room3", Type: "LivingRoom"},
    {Name: "Room4", Type: "Bathroom"},
    ]
    

    这就是一个例子。再次,绑定是一个非问题,它的工作原理。如果我使用knockout.mapping.toJS(model)提取模型并查看它,Observable Array(RoomInSuite)永远不会删除它的元素,即使服务器返回的JSON并不是全部存在。如果删除数组的最后一个元素但是对于任何其他情况都失败,它会被删除。

    编辑 - 解决方案(ish)

    好的,所以在花了一整天撞到墙上后,我发现了问题所在。与淘汰赛无关。对于以下情况,服务器为我提供了不同的JSON:

    1. 删除了最后一行数据。
    2. 删除了任何行(除了最后一行)。
    3. 主要是因为当你删除元素时,PHP的数组没有被重新编入索引,所以PHP从类似数组的结构到JSON的转换正在创建如下语法:

      在(A)和

      的情况下

      ["0":{datahere}, "1": {datahere}, "2":{datahere}]

      { "0": {datahere}, "3": {datahere}}如果是(B),

      问题在于,一旦我们将其转换为javascript,一个是对象,另一个是数组,并且knockout无法使用对象更新数组。我只是无法看到不同的括号,因为这个东西深深地嵌套在其他对象和数组的森林中,所以它就离开了。

0 个答案:

没有答案