1

我正在试验 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 和 setterif (arguments.length === 1)不太好读。

还有其他(希望是更好的)方法可以使用 ember.js 实现相同的目标吗?我怎样才能改善我不喜欢的地方?

4

1 回答 1

1

我没有完整的答案给你。我确实有一些可能被证明有用的点点滴滴。

获取任何对象的属性键,包括匿名 json 对象:

Ember.keys(someObject);

从 json 中设置对象的任何随机属性:

someObject.setProperties({json:"data"});

还有配套的吸气剂:

someObject.getProperties("key1", "key2");
someObject.getProperties(Ember.keys(someObject));

在您的情况下,列出键对于整理视图和在动态变化的数据集中逐个遍历每个属性非常有用。

我无法利用 Ember.keys() 动态列出要观察的属性。我担心你必须将你的简单 json 属性变成一个更智能的 Ember 对象,并通过实现“propertyDidChange”或其他东西在其上的一些“假”属性上设置观察者。

使用 setProperties 将允许您将“json”作为 Ember.Object 并仍然设置任何动态属性。观察对象的“任何”属性是困难的部分。我对 Ember 太陌生了,无法找到一种干净的方式来做到这一点……没有一堆观察者的东西。

于 2012-09-25T08:45:39.687 回答