KnockoutJS和单个对象绑定到视图模型 [英] KnockoutJS and binding a single object to a viewmodel

问题描述

我一直绕圈就这个问题和没有看到事情会出错。也许你可以帮助请

I've been round and round on this and don't see where things are going wrong. Maybe you can help please.

有多个视图模型设置：

var viewModels = {
    emailTemplateViewModel: {
        subject: new ko.observable('dd'),
        emailName: new ko.observable('dd'),
        emailAddress: new ko.observable('dd'),
        body: new ko.observable('dd')
    },
    deviceSettingsViewModel: {
        managerName: new ko.observable('')    
    }
}

ko.applyBindings(viewModels);

和我想填充JSON的视图模型中的一个从服务器返回（这是正确的，正确格式化）。

And I'm trying to populate one of the view models with JSON returned from the server (this is correct and properly formatted).

function LoadEmailTemplate() {
    $.getJSON('/EmailTemplate/Template', function (data) {
        viewModels.emailTemplateViewModel = ko.mapping.fromJS(data);
        ko.applyBindings(viewModels.emailTemplateViewModel);
    })
}

然而，当我运行此我得到以下错误：
未捕获的错误：不能将绑定多次相同的元素。

However when I run this I get the following error: "Uncaught Error: You cannot apply bindings multiple times to the same element."

但是，所有我看过的文档显示绑定映射后发生。

But all the documentation I read shows the binding occurring after the mapping.

如果我把从LoadEmailTemplate功能绑定了那里在运行时没有错误，但页面显示的默认值DD，而不是那些应该已经映射从JSON响应

If I take the binding out from the LoadEmailTemplate function out there are no errors at runtime but the page shows the default values 'dd', not those that should have been mapped from the JSON response.

该功能被触发这样的：

<li data-bind="click: LoadEmailTemplate"><a href="#"><i class="glyphicon glyphicon-chevron-right pull-right"></i>Email Template</a></li>

我想用用结合作为电子邮件模板是相对于仅一个区域页面，例如：

I'm trying to use the with-binding as the email template is relative to only a region of the page, e.g.

<div data-bind="with: emailTemplateViewModel">

和属性：

<input data-bind="value: emailAddress" type="email" class="form-control" id="inputFromEmail">

我知道这是工作，因为当第一次定义的设置的值加载窗体的视图模型。它看起来好像只是哑火的映射。任何意见将非常感激。

I know this is working because the form loads with the values set when the viewmodel is first defined. It appears as if it's just the mapping that's misfiring. Any advice would be really appreciated.

感谢您。

推荐答案

两件事情，
1 - 不适用绑定多次，即使这个工作后来会导致一些问题的道路结果
2 - 当你从AJAX调用的对象不会覆盖现有的对象，这样做会打破你的绑定，而不是设置现有对象的值到新的值。

Two things, 1 - Do not apply bindings multiple times, even if that works it will cause issues later down the road.
2 - When you get the object from the ajax call do not overwrite your existing object, doing this will break your bindings, instead set your existing object values to the new values.

function LoadEmailTemplate() {
    $.getJSON('/EmailTemplate/Template', function (data) {
        viewModels.emailTemplateViewModel.subject(data.subject);
        viewModels.emailTemplateViewModel.emailName(data.emailName);
        viewModels.emailTemplateViewModel.emailAdrress(data.emailAddress)
        viewModels.emailTemplateViewModel.body(data.body)
    })
}

这篇关于KnockoutJS和单个对象绑定到视图模型的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！