在Ember模板中访问常量

时间:2015-03-06 15:26:29

标签: ember.js ember-cli

不确定适当的“Ember Way”是做什么的。

我有以下模板,我希望有三个task-item-list组件实例,每个实例用于不同的taskState值。显然,我想摆脱神奇的数字。

<h4>Tasks:</h4>

<div><h5>Backlog:</h5>
  {{ task-item-list tasks=model taskState=101 }}
</div>

<div><h5>Working:</h5>
  {{ task-item-list tasks=model taskState=202 }}
</div>

<div><h5>Done!</h5>
  {{ task-item-list tasks=model taskState=303 }}
</div>

感谢this discussion我可以在我的config/environment.js文件中定义常量并在模型,测试等中使用它们,但在我的模板中没有(尽可能接近)。

有没有办法使用常量,还是有更好的方法来做到这一点?我可以看到子类化组件,但我认为这不是一个很好的解决方案。

谢谢!

2 个答案:

答案 0 :(得分:6)

您是否尝试在组件中注入env?像这样:

应用程序/初始化/注入-env.js

import env from '../config/environment';

export function initialize(container, application) {
  application.register('env:main', env, { singleton: true, instantiate: false });
  application.inject('component', 'env', 'env:main');
}

export default {
  name: 'inject-env',
  initialize: initialize
};

然后在任何组件中,您都可以使用config/environment.js属性获取env的内容。例如,{{env.environment}}将显示当前环境。

如果您只想注入task-item-list组件而不是所有组件,可以使用:

application.inject('component:task-item-list', 'env', 'env:main');

答案 1 :(得分:3)

我遇到了同样的问题并通过创建一个可以读取配置文件的帮助程序来解决它:

//...app/helpers/read-env.js
import Ember from 'ember';
import ENV from '../config/environment';

export function readEnv(params/*, hash*/) {
  if (params.length === 0) {
    return undefined;
  }

  return Ember.Object.create(ENV).get(params[0]);
}

export default Ember.Helper.helper(readEnv);

这样定义的常量:

ENV.CATEGORY = {
  'CATEGORY_1': 0,
  'CATEGORY_2': 1
};

在模板中,我使用它:

{{read-env 'CATEGORY.CATEGORY_1'}}