可能ember组件具有逻辑/计算值

Question

我正在使用最新版本的ember(1.13.5),但希望符合Ember 2.0标准.

我想创建一个具有一个输入参数和一些内部逻辑的组件来计算另外两个值,因此组件模板有3个字段可以绑定到变量.

如果这是一个普通的模板,这将很好地与控制器.但是组件没有控制器.Ember.Component子类有什么可能？

组件定义于\templates\components\my-component.hbs:

<h1>{{value1}}<h1>
<h2>{{value2}}<h2>
<h3>{{value3}}<h3>

在模板中使用:

{{my-component value1=34}}

然后一些javascript在某处定义value2和value3:

value2 = value1 *3;
value3 = value2 *6;

在哪里放这个javascript所以value2和value3在我的组件中可用？(这只是一个简单的例子.value2和value3的真实逻辑更复杂,但仅基于value1.)

Answer 1

是的,当然可以,你可以将它放在一个已定义的组件类中.

这可能是你的组件真的\templates\components\my-component.hbs而不是\templates\components\my-component.js.您需要做的是为组件定义一个类\components\my-component.js

如果您正在使用Ember-cli并且您使用了脚手架,那么它可能已经存在,然后您将在其中放置计算属性以实现value2和value3.

如果你不是,它将是这样的(除非你使用全局变量).

import Ember from "ember";

export default Ember.Component.extend({
  value2: Ember.computed('value1', function() {
    //....
  })
});