javascript - Ember.JS 值绑定(bind)在 Action 中不起作用

Question

我正在尝试让值绑定(bind)在我的 Ember 应用程序中正常工作。绑定(bind)适用于输入，例如，当我在输入字段中键入文本时，它会显示在“您的目标:”旁边。但是，当我单击“下一步”时，它没有正确显示该值。

这是一个包含我的问题的 JSBIN:http://emberjs.jsbin.com/buxega/edit?html,js,console,output

目标路线

import Ember from 'ember';

export default Ember.Route.extend({
  goal: '',
  actions: {
    nextStep: function() {
      console.log('Goto next step: ', this.get('goal'));
    }
  }
});

模板

<section>
  <div class="pod__content">
    Your Goal: {{goal}}
    {{input type="text" value=goal}}
  </div>
  <footer>
    <button {{action 'nextStep'}} class="btn btn--red">Next Step</button>
  </footer>
</section>

Answer 1

您在 Controller 中设置值 {{goal}}，而不是在路由中。

import Ember from 'ember';

export default Ember.Controller.extend({
  goal: '',
  actions: {
    nextStep: function() {
      console.log('Goto next step: ', this.get('goal'));
    }
  }
});

http://emberjs.jsbin.com/nabeqakicu/1/edit?html,js,console,output

如果你想将值发送到路由，你可以这样做:

<button {{action 'nextStep' goal}} class="btn btn--red">Next Step</button>

你会在行动中得到它:

export default Ember.Route.extend({
  goal: '',
  actions: {
    nextStep: function(goal) {
      console.log('Goto next step: ', goal);
    }
  }
});