我正在试验 ember.js。我的目标是拥有一个包含一些 json 的文本区域和一些靠近它的文本字段,其中包含 json 的某些特定属性的值。假设这是json:
{
property1 : "value1",
property2 : "value2"
}
第一个文本字段将连接到 property1,第二个文本字段将连接到 property2。每当我在其中一个文本字段上键入内容时,我都希望使用新的 json 使 textarea 保持最新。每当我从 textarea 更新 json 时,我也想让文本字段保持最新,只要 json 仍然有效。
我使用一个包含 json 本身的模型和一个计算属性来让它工作模型。
App.JsonModel = Ember.Object.extend({
json : {property1:"value1",property2:"value2"},
asString : function(key, value) {
//getter
if (arguments.length === 1) {
return JSON.stringify(this.get('json'), null, ' ');
//setter
} else {
try {
this.set('json', JSON.parse(value));
} catch(err) {
}
return value;
}
}.property('json', 'json.property1', 'json.property2')
});
这是带有视图的 html:
json:
{{view Ember.TextArea valueBinding="App.jsonModel.asString" class="json"}}
property1:
{{view Ember.TextField valueBinding="App.jsonModel.json.property1"}}
property2:
{{view Ember.TextField valueBinding="App.jsonModel.json.property2"}}
您也可以查看工作示例。
在我当前的代码中有几件事我不喜欢:
- 我需要指定所有可能导致 json 的版本字符串发生变化的属性,因为 json 本身是不够的,不确定这是否是预期的行为:
.property('json', 'json.property1', 'json.property2')
. 我想让 asString 函数尽可能通用,而不提及任何特定的 json 属性。 - 在我看来,基于 的计算属性 getter 和 setter
if (arguments.length === 1)
不太好读。
还有其他(希望是更好的)方法可以使用 ember.js 实现相同的目标吗?我怎样才能改善我不喜欢的地方?