Question

使用以下代码，我希望每当 ko.mapping.fromJS（response.results，viewModel）; 被调用时，都会将任何新对象添加到viewModel中并删除所有删除对象。但它只添加了新对象，旧的对象仍然存在于html中：

var viewModel = ko.mapping.fromJS([],
{
        key: function(data) {
            return ko.utils.unwrapObservable(data.Id);
        },
        create: function (options) {
            return new newConfigModel(options.data);
        }
});

var newDispModel = function (data) {
        ko.mapping.fromJS(data, {}, this);

        this.DisplayTitle = ko.dependentObservable(function() { return GetDisplayTitle(this); }.bind(this));
        this.StatusClass = ko.dependentObservable(function () { return GetStatusClass(this); }.bind(this));

        this.FeedIndexShadow = "";
        this.FeedIndex = ko.dependentObservable(function() { return GetNewFeedIndex(this); }.bind(this));
    };

$(document).ready(function () {

    function loadConfigurations() {
        var url = "/Home/GetItems/";
        $.ajax({
            url: url,
            success: function(response) {

                if (response.success) 
                {
                    ko.mapping.fromJS(response.results, viewModel);

....最后一部分......

<div class="container" id="feeds"  data-bind="foreach: viewModel">

    <div data-bind="attr: { 'class': StatusClass, 'id': FeedIndex }" style="display: none">
        <div class="configRow">
             <h2 class="title" data-bind="text: DisplayTitle"/>
        </div>
    </div>
</div>

我错过了什么？有什么东西与键，我必须简单地从observable手动删除“死”对象或我完全误解了ObservableArrays的功能？

Answer 1

这是一个显示交互的JSFiddle：

注意：映射中的“更新”条目只是因为我可以登录到控制台......除非您需要自定义更新的发生方式，否则不需要它。

http://jsfiddle.net/jearles/wgZ59/49/

点击'加载矩阵'，它将显示：

12
23
34

点击“更改”，它将重新加载矩阵：

24
45

查看我发布的控制台消息，您会看到：

Creating 1
Updating 1
Creating 2
Updating 2
Creating 3
Updating 3
Updating 2
Creating 4
Updating 4

这似乎证实了行动正在按预期发生。

12 - Is deleted
23 - Is changed to 24
34 - Is deleted
45 - Is added

-

'key'条目通过将特定属性指定为“密钥”，帮助映射插件确定哪些条目是新的或现有的;否则整个对象的比较是相等的。

http://knockoutjs.com/documentation/plugins-mapping.html

KnockoutJS.Mapping.FromJS - 可观察数组 - 删除不工作

1 个答案: