2

我正在通过 ember-cli 学习 Ember。我有一个问题,我认为它与“除非有东西试图获取它们,否则不会计算计算的属性”,但在这种情况下我无法弄清楚如何“获取”该属性。我使用 ember-cli 创建了一个应用程序、一个控制器、一个服务和一个模板:

ember new st
cd st/
ember g controller index
ember g service start
ember g template index

控制器:

import Ember from 'ember';

export default Ember.Controller.extend({
  start: Ember.inject.service(),
  value: Ember.computed('start', function () { 
    return this.get('start').value;
  }),
  actions: {
    update: function() {
      this.get('start').update();
      alert(this.get('start').value);
  }
 }
});

服务:

import Ember from 'ember';

export default Ember.Service.extend({
  value: "original",
  update: function() {
    this.set('value', "updated");
  }
});

模板:

<p>{{value}}</p>
<br>
<button {{action "update"}}>Update</button><br>

然后我用“ember serve”服务这个。正如预期的那样,显示的值是初始值“原始”。当我单击“更新”按钮时,我会收到一条警报,显示新值“已更新”,但原始值仍保留在屏幕上。我怎样才能“获取”这个注入的属性,以便计算并更新它?

ember-cli 是 1.13.8,ember 本身是 2.0.1

4

1 回答 1

1

您声称依赖于start财产,但start财产本身并没有改变,value财产start是。您应该将其更改为依赖valuestart. get此外,可以在函数中获取更深层次的属性。

export default Ember.Controller.extend({
  start: Ember.inject.service(),
  value: Ember.computed('start.value', function () { 
    return this.get('start.value');
  }),
  actions: {
    update: function() {
      this.get('start').update();
      alert(this.get('start.value'));
  }
 }
});

对于踢腿和咯咯笑,这可以通过两种方式更容易地编写。

使用别名:

export default Ember.Controller.extend({
  start: Ember.inject.service(),
  value: Ember.computed.alias('start.value'),
  actions: {
    update: function() {
      this.get('start').update();
      alert(this.get('start.value'));
    }
  }
});

只需在模板中引用它

export default Ember.Controller.extend({
  start: Ember.inject.service(),
  actions: {
    update: function() {
      this.get('start').update();
      alert(this.get('start.value'));
  }
 }
});

<p>{{start.value}}</p>
<br>
<button {{action "update"}}>Update</button><br>
于 2015-08-27T05:38:19.117 回答