1

リレーションシップDocumentを使用して定義された属性/プロパティを持つモデルがあります。目的は、やのようなプレゼンテーション属性を作成しながら、、hasManyのようなドキュメントのさまざまな領域でコンテンツを自由に定義できるようにすることです。headerbodyfootercolorimage

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.documentAttributesso を返すDS.ManyArrayので、レンダリングするために次のことができます。

{{#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;
}

HB

<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 に答える