绑定到将从API获取的值

时间:2014-07-02 12:58:31

标签: ember.js

我有一个返回艺术家列表的端点(json数据)。 以及返回给定id的特定属性的端点。

我想要做的是遍历所有艺术家并在模板中向用户显示一个或多个属性,但只有在模板中绑定属性时才应该从API中获取属性。

在我的ArtistsRou​​te中,我将模型设置为通过调用getJSON获取的所有艺术家......

我想,以某种方式能够获取艺术家的属性并显示它(通过绑定)。

属性贴图可以存储在ArtistController中。

我找不到一个很好的例子。任何帮助表示赞赏!

模板示例: 名称位于艺术家对象本身上,但是已手动创建“属性”对象。因此,在ArtistController中,它可以初始化为空:

Properties = {}

然后它将Propertes ['ShortName'] =设置为获取的值。

<ul>
{{#each}}
  <li>
    {{Name}}
    {{Properties.ShortName}}
    <img {{bind-attr src=Properties.MainImage}} />
  </li>
{{/each}}
</ul>

我应该使用函数作为属性还是Handlebars助手?像:

{{Property this 'ShortName'}}

其中'this'是ArtistController,'ShortName'是要获取的属性。可以通过ArtistController和propertyName计算属性id。

function(tag, propertyName) {
  Ember.$.getJSON('/Properties/' + tag.Id + '_' + propertyName).then(function(response) {
    var propertyValueToBind = response.Value; // This is the value I want to display in the template.
  });
}

然后Property函数必须知道何时重新呈现模板(一旦从API获取属性)。

1 个答案:

答案 0 :(得分:0)

首先,您通常希望避免使用大写的属性。它们通常被认为是全局属性,而不是范围。

Ember lazy默认加载计算属性,因此将该功能添加到计算属性将是一个很好的方法。

someProperty: function(){
  var promise = Ember.$.getJSON('/Properties/buildupurl');
  return Ember.ObjectProxy.extend(Ember.PromiseProxyMixin).create({
    promise: promise
  });
}.property()

然后在你的模板中,someProperty会像这样访问

{{someProperty.value}}

将异步填充。

示例:http://emberjs.jsbin.com/OxIDiVU/769/edit