data-binding - 带绑定的 knockout.js

Question

这可能是一个非常基本的问题，但在下面的视图模型中，我从 ajax 调用中填充 self.userData。我想在 UI 中显示此信息，我认为“with”绑定是可行的方法。但是，由于 self.userData 是空的，直到调用 ajax 函数，我从 with 绑定中得到一个错误

HTML

<div data-bind="with: userData">
    <div data-bind="text: userId"></div>
     ...
</div>

模型

var viewModel = function () {
        var self = this;
        self.userData = {};
        self.login =  function(data) {
            var postData = { ..trimmed out.. };
            $.ajax({
                type: "POST",
                url: "myService",
                data: postData
            }).done(function (data, status) {
                self.userData = ko.mapping.fromJS(data, userData);
                console.log(self.userData);

            }).fail(function (data, status) {
                alert('Could Not Login');
            });
        }

    };
    ko.applyBindings(new viewModel());

Answer 1

用一个空的 observable 初始化 userData，然后在调用返回时用映射插件创建的对象设置它。即改变

self.userData = {};

和

self.userDara = ko.observable();

和改变

self.userData = ko.mapping.fromJS(data, userData);

和

self.userData(ko.mapping.fromJS(data,userData));

Answer 2

您需要首先将 userData 初始化为空的 observable（来自 ajax 调用的单个对象）或 observable 数组（多个对象）：

self.userData = ko.observableArray([]);

或者

self.userData = ko.observable();