JsObservable设置具有子属性的属性

我将如何着手对具有子属性数据的对象进行可观察的更新 - 链接到表单元素？JsObservable设置具有子属性的属性

var app = { 
 
    formData: { 
 
     selectedThing: "thingValue1", 
 
     selectedPlace: "placeValue1" 
 
    } 
 
}; 
 

 

 

 
$("#btnUpdate").on("click", function(){ 
 
    var replacementForm = { 
 
     selectedThing: "thingValue2", 
 
     selectedPlace: "placeValue2" 
 
    } 
 
    $.observable(app).setProperty("formData", replacementForm); 
 
}); 
 

 
$("#content").link(true, app);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> 
 
<script src="http://www.jsviews.com/download/jsviews.js"></script> 
 

 
<div id="content"> 
 
    <input data-link="formData.selectedThing trigger=true"/> 
 
    <br/> 
 
    <input data-link="formData.selectedPlace trigger=true"/> 
 
</div> 
 

 
<button id="btnUpdate" type="button">Update</button>

我有一些输入字段中的数据链接到一个对象的属性，并且当用户按下按钮，所有这些字段的需要使用的对象（从所接收的获取更新。服务器作为JSON，反序列化为一个对象相同的形式的元素的基础的数据对象）这是我的jsfiddle： http://jsfiddle.net/xpe1ds0a/

来源

2015-11-05 Brian Hinckle

回答从https://stackoverflow.com/a/32339038/1054484

“克隆” 10

它不工作的原因是因为您正在使用“深度路径”formData.selectedThing - 默认情况下，它仅在叶级别“监听”可观察的更改，而不是更深。要选择加入也听着formData对象的变化，不只是叶selectedThing属性，则需要通过^更换.，表示要下来听听路径更深的层次：

<input data-link="formData.selectedThing trigger=true"/> 
<input data-link="formData.selectedPlace trigger=true"/>

查看部分路径：叶子变化或深度变化在本文档主题： http://www.jsviews.com/#observe。

另请参阅示例，如示例：带有普通对象的JsViews和本主题中的数组：http://www.jsviews.com/#explore/objectsorvm。

更新的jsfiddle这里：http://jsfiddle.net/xpe1ds0a/1/

来源

2015-11-05 02:02:45 BorisMoore

会不会有一个简单的方法来删除根对象上用来使这个例子工作时，可观察到的订阅“^”创建多余的“jQuery的＃”财产？我无法将formData发送到服务器，因为JSON对象突然与数据合同不匹配。 –

JSON.stringify（object）将去除jQuery expando属性。有关详情，请参阅https://github.com/BorisMoore/jsviews/issues/71以及https://github.com/BorisMoore/jsviews/issues/239。 – BorisMoore

JsObservable设置具有子属性的属性

回答

相关问题