Question

所以我按如下方式绑定我的Knockout模板：

首先是ajax，获取数据然后我传递数据就可以调用一个名为bindKo的函数：

function bindKo(data) {
            var length = data.length;
            var insertRecord = {};

            if (length > 0) {
                insertRecord = data[data.length - 1]; //last record is an empty PremlimViewModel for insert
                insertRecord.Add = true;
                data.splice(data.length - 1, 1); //remove that blank insert record
            }

            function prelims(data) {
                var self = this;
                var model = ko.mapping.fromJS(data, { copy: ["_destroy"] }, self);


                self.BidPriceFormatted = ko.computed({
                    read: function () {
                        var bidPrice = this.BidPrice();
                        if (bidPrice) {
                            if (!isNaN(bidPrice)) {
                                var input = '<input type="text" value="' + bidPrice + '"/>';
                                return $(input).currency({ decimals: 0 }).val();
                            }
                        }
                    },
                    write: function (value) {
                        value = value.replace(/\D/g, '');
                        this.BidPrice(value);
                    },
                    owner: this
                });

                return model;
            }

            var mapping = {
                create: function (options) {
                    return new prelims(options.data);
                }
            };

            function viewModel(prelimData) {
                var self = this;


                self.prelims = ko.mapping.fromJS(prelimData, mapping);
                self.remove = function (prelim) {
                    self.prelims.destroy(prelim);
                };
                self.addOption = function () {
                    var clone = jQuery.extend(true, {}, insertRecord);

                    self.prelims.push(ko.mapping.fromJS(clone));
                };
            }

            ViewModel = new viewModel(data);
            ko.applyBindings(ViewModel);
        }

我定义了一个模板，您可以在其中添加和删除记录，用户可以这样做：

<script type="text/html" id="PrelimsTemplate">
<!--Template Goodness-->
</script>

然后，ajax调用，在datanbase中更新记录，返回最新结果，我做了：

ko.mapping.fromJS(newestData, ViewModel)

但这不起作用，因为我的ViewModel很复杂。所以我想完全重新绑定模板。 Make消失并重新出现最新数据。

Answer 1

将您的模板换成container而不是jQuery挂钩。

如果您需要删除它，请使用ko.cleanNode和jQuery .empty()

emptyTemplate: function(){
  ko.cleanNode($('#template-container')[0]);
  $('#template-container').empty();
}

重新加载模板

fillTemplate: function(){
    $('#template-container').html('<div data-bind="template: {name:\'templateId\', data: $data}"></div>');

    ko.applyBindings(data,$('#template-container')[0])
},

请参阅my fiddle

使用KnockoutJs模板清理和重新绑定数据

1 个答案: