Question

我在jsfiddle上创建了一个示例。我也会在这里删除代码：

使用Javascript：

window.App = Ember.Application.create();

TypeA = Ember.Object.extend({
  propertyA: ""
});

TypeB = Ember.Object.extend({
  propertyB: ""
});

App.someController = Ember.ArrayProxy.create({
    content: []
});

var aa = TypeA.create({propertyA: "aa"});
var ab = TypeA.create({propertyA: "ab"});
var ba = TypeB.create({propertyB: "ba"});
var bb = TypeB.create({propertyB: "bb"});

// I'm probably just copying the string here so sort of realizing
// that the binding "breaks", however I don't get how to maintain the "bond".
App.someController.pushObject(aa.get("propertyA"));
App.someController.pushObject(ab.get("propertyA"));
App.someController.pushObject(ba.get("propertyB"));
App.someController.pushObject(bb.get("propertyB"));

// I'd like this to update the value "aa" in the list
aa.set('propertyA', "AA");

HTML：

<script type="text/x-handlebars">
  {{#collection contentBinding="App.someController" tagName="ul"}}
    {{content}}
  {{/collection}}
</script>

因此someController中条目的来源可以是各种不同的对象，但是应该保留对象的属性和someController中的条目之间的联系。有什么简单的方法吗？我想把someController中的值包装在某个对象或视图中，但我找不到如何创建一个绑定到非“全局”对象（我看到的所有绑定似乎都使用了一个完整的“全局”路径，例如"App.someObject.property"）

任何想法都非常感谢！感谢。

Answer 1

希望这就是你所追求的：jsfiddle。

我认为你需要将对象推入数组而不是属性。

App.someController.pushObject(aa);
App.someController.pushObject(ab);
App.someController.pushObject(ba);
App.someController.pushObject(bb);

然后，在您的模板中，引用所需的属性。

<script type="text/x-handlebars">
    {{#collection contentBinding="App.someController" tagName="ul"}}
        {{content.propertyA}}
        {{content.propertyB}}
    {{/collection}}
</script>

通过将aa.get("propertyA")推入数组，您只需按一个简单的字符串，对象与数组之间的关系就会被破坏。

我建议创建一个计算属性，以确定是否需要为任何一个对象返回propertyA或propertyB。然后，您可以在集合中使用computed属性。

<script type="text/x-handlebars">
    {{#collection contentBinding="App.someController" tagName="ul"}}
        {{content.newComputedProperty}}
    {{/collection}}
</script>

Answer 2

好的，所以我在Veebs帖子的帮助下弄清楚了。我把这些字符串（源自该属性）包裹在以下形式的对象中：

Ember.Object.create({
    obj: obj,
    out: function() { 
        return this.get('obj').get(property); 
    }.property('obj.' + property)
});

显然，当一个对象的属性发生变化时，该对象（以某种方式）被标记为已更改，因此通过说out取决于obj，它会获取obj.property中的更改。 / p>

所以这是带有更改的原始代码：

window.App = Ember.Application.create();

TypeA = Ember.Object.extend({
    propertyA: "",
    propertyC: ""
});

TypeB = Ember.Object.extend({
    propertyB: "",
});

App.someController = Ember.ArrayProxy.create({
    content: []
});

var a = TypeA.create({propertyA: "aa", propertyC: "ac"});
var b = TypeA.create({propertyB: "bb"});

function createWrapper(obj, property) {
    return Ember.Object.create({
        obj: obj,
        out: function() { 
            return this.get('obj').get(property); 
        }.property('obj.' + property)
    });
}

App.someController.pushObject(createWrapper(a, "propertyA"));
App.someController.pushObject(createWrapper(a, "propertyC"));
App.someController.pushObject(createWrapper(b, "propertyB"));

setTimeout(function() {
    a.set('propertyA', "AA");
    a.set('propertyC', "AC");
    b.set('propertyB', "BB");
    a.set('propertyA', "AA2"); 
},2000);

...和（略有改动的）模板：

<script type="text/x-handlebars">
    {{#collection contentBinding="App.someController" tagName="ul"}}
        {{content.out}}
    {{/collection}}
</script>

（也可在jsfiddle上找到）

感谢您的帮助！

编辑：第二个想法，这不起作用，至少在一段时间后更新发生时不行。他妈的。编辑：已更新为固定版本，是的。

可以将ArrayProxy中的条目绑定到某个其他对象上的属性吗？

2 个答案: