0

假设我有一个项目列表，数据是通过映射插件创建的，列表为空是正常的。我想要一个执行编辑和创建操作的表单，它应该绑定到单个选定的项目。

<div id="appointment-modal" class="reveal-modal" data-bind="with: appointment">
    <form id="appointment-form" data-bind="submit: submit_appointment">
        <input type="text" name="name" data-bind="value: name"/>
        <textarea name="description" data-bind="value: description"></textarea>
        <input type="text" name="time" data-bind="value time" />
        <input type="text" name="address1" data-bind="value: address1"/>
        <input type="text" name="address2" data-bind="value: address2"/>
        <input type="text" name="phone" data-bind="value: phone"/>
        <input type="text" name="email" data-bind="value: email"/>
    </form>
</div>

问题是，我收到抱怨未定义约会的错误：

Uncaught ReferenceError: Unable to parse bindings.
Bindings value: with: appointment
Message: appointment is not defined

我也许可以使用“if”绑定来检查是否appointment存在，但我不知道如何满足创建，理想情况下我想重用相同的表单。

遇到这个链接，我可以创建一个虚拟的可观察的“约会”，但是由于约会是虚拟的，所以 div 什么也不渲染，这对于创建新的约会项目特别不利。

4

2 回答 2

3

我想出了一个解决方法，它不是定义一个 observable，而是定义一个 observableArray()

在模板中，不要像这样绑定 observable：

<div data-bind="with: listing">
  <div data-bind="text: title">
</div>

你绑定就像循环遍历一个数组：

<div data-bind="foreach: listing">
  <div data-bind="text: title">
</div>

所以模板不会抱怨字段尚未映射。

要将列表填充到模板中，就像使用映射插件一样：

vmodel.listing.removeAll();
vmodel.listing.push(ko.mapping.fromJS(listing_json));
于 2013-11-13T22:15:48.783 回答
0

是的，您需要定义该属性，即使它为空（小提琴- 这就是您所遇到的）。正如您所发现的，您只需要使用 null 值（observables 的默认值）定义属性，然后稍后将约会对象添加到它（小提琴）。这是完全可以接受的。

function ViewModel() {
    var self = this;
    self.appointment = ko.observable();// Don't set any value
}

这是进行“后期绑定”的一种方法。如果稍后，您将一些新的 html 添加到 DOM，您可以调用ko.applyBindingsToDescendants(myViewModel, $("#parentDiv")[0]). 但是在您的特定情况下，我可能会self.appointment提前定义该属性。

更新：

创建一个定义了所有属性的对象并像这样绑定它：fiddle。然后在提交时，清除所有字段。

于 2013-09-09T01:56:51.873 回答