从javascript函数更新Knockout viewmodel表单输入绑定

Posted 2021-05-05

我正在使用html表单，其输入绑定到Knockout视图模型。其中两个表单输入是纬度/经度坐标的双重类型：

<div class="form-group">
    <input class="form-control" name="Observation.LocationLatitude" data-bind="value: Observation.LocationLatitude" id="latitude" />
    <input class="form-control" name="Observation.LocationLongitude" data-bind="value: Observation.LocationLongitude" id="longitude" />
</div>

我从我的Google Maps javascript函数更新这些：

document.getElementById('latitude').value = markers[0].position.lat();
document.getElementById('longitude').value = markers[0].position.lng();

代码更新输入字段，但不更新对viewmodel的绑定。

视图模型更新的唯一方法是直接输入到输入字段。在documentation之后，我尝试了“textInput”绑定，以及值输入绑定没有成功。我还尝试在Javascript中设置/更新输入字段的焦点。这也行不通。

有谁知道是否有可能从Javascript更新绑定？

答案

让淘汰赛为您做繁重的工作 - 您只需要担心更新您的模型，淘汰赛将更新视图。假设您的模型属性是可观察的：

Observation.LocationLatitude(markers[0].position.lat());
Observation.LocationLongitude(markers[0].position.lng());

通常，如果您使用knockout来管理DOM，您希望不要直接更新它（包括输入的值，正如您在这里尝试的那样），因为至少淘汰赛时不会意识到更新（如在这里），或者更糟，它会导致冲突和错误。