1

我有一个Document模型,它使用hasMany关系定义了属性/属性。目的是能够自由地定义文档不同区域中的内容,例如,,header同时还创建表示属性,例如或。bodyfootercolorimage

KF.Document = DS.Model.extend
  title: DS.attr 'string'
  documentAttributes: DS.hasMany 'documentAttribute'

KF.DocumentAttribute = DS.Model.extend
  attrKey: DS.attr 'string'
  attrValue: DS.attr 'string'
  document: DS.belongsTo 'document'

Document.documentAttributes返回一个DS.ManyArrayso 为了渲染它,我可以执行以下操作:

{{#each da in documentAttributes}}
  <p>{{da.attrKey}} - {{da.attrValue}}</p> <!-- returns: "header - this is my header" -->
{{/each}}

问题是我想直接访问密钥(使用代理?)所以我可以像这样直接绑定数据:

{{textarea value=documentAttributes.header cols="80" rows="6"}}
<img {{ bindAttr src="documentAttributes.imageSrc" }} >
{{textarea value=documentAttributes.footer cols="80" rows="6"}}

我应该如何处理这个?

4

2 回答 2

0

一种方法可以是增强一个 em 视图(对于勇敢的人,也可以是一个组件),或者创建一个代理,它接收一个 DocumentAttribute 对象并动态定义一个名为 attrKey 值的属性并返回 attrValue 的值。您可以使用以下代码实现此目的,

http://emberjs.jsbin.com/ehoxUVi/2/edit

js

App = Ember.Application.create();

App.Router.map(function() {
});

App.IndexRoute = Ember.Route.extend({
  model: function() {
    return createProxy(App.DocumentAttribute.create());
  }
});

App.DocumentAttribute = Ember.Object.extend({
  attrKey:"theKey",
  attrValue:"theValue"
});



 function createProxy(documentAttr){
  App.DocumentAttributeProxy = Ember.ObjectProxy.extend({
    createProp: function() {
      _this = this;
      var propName = this.get('attrKey');
      if (!_this.get(propName)) {
        return Ember.defineProperty(_this, propName, Ember.computed(function() {
          return _this.get('attrValue');
        }).property('attrKey'));
      }
    }.observes('content')
  });
  var proxy = App.DocumentAttributeProxy.create();
  proxy.set('content',documentAttr);
  return proxy;
}

乙肝

<script type="text/x-handlebars">
    <h2>Welcome to Ember.js</h2>

    {{outlet}}
  </script>

<script type="text/x-handlebars" data-template-name="index">
    {{attrKey}}
    <br/>
    {{attrValue}}

    <br/>
    {{theKey}}
  </script>
于 2013-11-01T14:17:18.617 回答
0

我无法让 melc 的解决方案与关系返回的 DS.ManyArray 一起使用。

但他的例子给了我一些想法,我做了以下。基本上通过控制器上的“快捷键”映射项目。

KF.DocumentsShowRoute = Ember.Route.extend
  setupController: (controller, model) ->
    controller.set('model', model)
    # make an `Object` to store all the keys to avoid conflicts
    controller.set('attrs', Ember.Object.create())

    # loop through all `DocumentAttributes` in the `DS.ManyArray` returned by the relationship,
    # get the `attrKey` from each item and make a shortcut to the item under `attrs` object
    model.get('documentAttributes').forEach (item, index, enumerable) -> 
      key = item.get('attrKey')
      controller.get('attrs').set(key, item)

模板,其中标头attrKey

{{input value=attrs.header.attrValue}}
于 2013-11-01T17:25:42.440 回答