Knockout.js:未观察到 ViewModel 属性

Knockout.js: ViewModel Properties not observed

我想我在某处遗漏了一个基本概念。 下面代码的输出是 100%,但对象的属性不是 "observed".

<script>
    var model = { };

    var mapping = {            
            create: function () {
                var _profile;
                $.ajax({
                    type: "GET",
                    url: 'Manage.aspx/GetContact',
                    contentType: "application/json; charset=utf-8",
                    dataType: "json",
                    async: false,
                    success: function (results) {
                        _profile = results.d;
                    },
                    error: function (err) {
                        alert(err.status + " - " + err.statusText);
                    }
                });
                return _profile;
            }
    };      

    $(document).ready(function () {                        
        var vm = ko.mapping.fromJS(model, mapping);
        ko.applyBindings(vm);
    });
</script>

<dl class="dl-horizontal">
    <dt>
    <label>E-Mail:</label></dt>
        <dd><span data-bind="text: E_Mail" /></dd>
        <dd><asp:TextBox runat="server" data-bind="value: E_Mail" /></dd>
</dl>

我背后的代码:

[WebMethod]
[ScriptMethod(UseHttpGet = true)]
public static DynamicsNAV.NavContact.Contact GetContact()
{
    DynamicsNAV.NavContact.Contact contact = ReadContact();
    if(contact == null)
    {
        contact = new DynamicsNAV.NavContact.Contact();
        contact.E_Mail = HttpContext.Current.User.Identity.Name;
    }

    return contact;
}

在此示例中,我尝试查看 UI 在更改文本框中的电子邮件地址时是否更新,但事实并非如此。 如果我添加电子邮件:ko.observable(); 属性 到模型,并在文本框和标签中使用它,更新按预期工作。

如果我这样做:

var model = ko.observable();

加载页面时不显示任何值。并且没有出现错误。

亲切的问候, EV

感谢您的回复,它确实让我的思考过程走上了解决问题的道路!

我的问题似乎出在映射和处理顺序上。 总的来说,我误解了'create'在映射中的作用。 我认为它可以帮助检索和填充模型。

所以这最终成为我的解决方案:

  • 填充数据
  • 将其映射到视图模型

    var model = { };
    
    var vm;
    $(document).ready(function () {
    
        $.ajax({
            type: "GET",
            url: 'Manage.aspx/GetContact',
            contentType: "application/json; charset=utf-8",
            dataType: "json",
            async: false,
            success: function (results) {
                model = results.d;
            },
            error: function (err) {
                alert(err.status + " - " + err.statusText);
            }
        });
    
        vm = ko.mapping.fromJS(model);
        ko.applyBindings(vm);
    });