有没有办法在 EmberJS 中迭代视图的上下文属性?我正在为 ORM 使用 Ember-Data (https://github.com/emberjs/data)。
假设我使用 connectOutlets 向具有电子邮件、姓名等属性的用户注册 UserView。在连接的 Handlebars 模板中,无论如何我可以遍历这些属性吗?
我基本上需要构建一个可以与不同模型重用的通用视图......
有没有办法在 EmberJS 中迭代视图的上下文属性?我正在为 ORM 使用 Ember-Data (https://github.com/emberjs/data)。
假设我使用 connectOutlets 向具有电子邮件、姓名等属性的用户注册 UserView。在连接的 Handlebars 模板中,无论如何我可以遍历这些属性吗?
我基本上需要构建一个可以与不同模型重用的通用视图......
Ryan 对属性的看法是正确的,但实际上需要做一些事情才能真正达到目标。我这里的例子是使用最新的 RC1 Ember。
这是一个与模型无关的编辑器模板:
<script type="text/x-handlebars" data-template-name="edit_monster">
{{#if clientId}}
<h1>Edit Monster: {{name}}</h1>
<div>
{{#each metadata}}
<span class="edit-label">{{name}}</span>
<span class="edit-field">
{{view App.AutoTextField typeBinding="type" nameBinding="name" }}
</span>
{{/each}}
</div>
{{else}}
No monster selected.
{{/if}}
</script>
为了完成这项工作,我们需要一些魔法魔法。这个控制器是一个好的开始:
App.EditMonsterController = Em.ObjectController.extend({
metadata: function() {
var vals = [];
var attributeMap = this.get('content.constructor.attributes');
attributeMap.forEach(function(name, value) {
vals.push(value);
});
return vals;
}.property('content')
});
它使用 Ryan 提到的“属性”属性来提供元数据,我们将这些元数据输入到模板中的 #each 中!
现在,这是一个我们可以用来提供文本输入的视图。需要一个外部容器视图来将 valueBinding 输入到实际的文本字段中。
App.AutoTextField = Ember.ContainerView.extend({
type: null,
name: null,
init: function() {
this._super();
this.createChildView();
},
createChildView: function() {
this.set('currentView', Ember.TextField.create({
valueBinding: 'controller.' + this.get('name'),
type: this.get('type')
}));
}.observes('name', 'type')
});
这是一个展示整个疯狂事物的小提琴:http: //jsfiddle.net/Malkyne/m4bu6/
代表模型的 Ember Data 对象具有attributes
包含给定模型的所有属性的属性。这就是 Ember DatatoJSON
用来将您的模型转换为 Javascript 对象的方法。
您可以使用此 attributes 属性来读取模型属性,然后将这些特定属性从实例中提取出来。这是一个例子。
只是重申这里发生了什么。我们从 App.User 读取属性,然后从 App.ryan 和 App.steve 中提取值。希望这是有道理的。