为什么我的ui没有更新?

时间:2017-10-02 05:50:57

标签: jquery debugging knockout.js data-binding jsfiddle

当我尝试add items用户输入时:

// Here's my data model
var ViewModel = function() {
    var self = this;
    self.concentration = ko.observable();
    self.calibrations = ko.observableArray();
    self.sampleMeasure = ko.observable();

    self.add = function() {
    debugger;
        self.calibrations.push({
            x: undefined,
            yT: undefined,
            yM: undefined
        });
    };

    self.remove = function() {
        self.calibrations.remove(this);
    };

    self.testing = function() {
        var data = [
            { x: 2, yT: 5.5, yM: 5.3 },
            { x: 6, yT: 13.5, yM: 13.2 },
            { x: 8, yT: 17.5, yM: 17.2 },
            { x: 10, yT: 21.5, yM: 21.6 },
            { x: 14, yT: 29.5, yM: 29.3 },
            { x: 19, yT: 39.5, yM: 39.6 }
        ];

        ko.utils.arrayPushAll(data, self.calibrations);

        self.calculateSampleConcentration();
    };

    self.calculateSampleConcentration = function() {
    debugger;
        self.concentration = 5;
    };

    self.testing();
};

ko.applyBindings(new ViewModel()); // This makes Knockout get to work

我尝试添加debugger;语句以查看发生了什么,但它并未显示源代码在那里打破,尽管它显示处理器已停止。< / p>

它还会继续显示以下错误:

{"error": "Please use POST request"}

即使我删除了输入周围的表单元素。

1 个答案:

答案 0 :(得分:1)

你不是binding click events正确的:

应该是:

<button data-bind="click: add">Add Calibration</button>

remove按钮也应更改为:

<button data-bind="click: $parent.remove">Remove</button>

删除功能仍然无法正常工作。它应该改为:

self.remove = function(item) {
   // "item" argument will have the current calibration item being removed
   self.calibrations.remove(item);
};

这里是updated fiddle。您需要沿同一行更改其他按钮。