Question

我有一个具有输入字段和相关按钮的表单，我有一个函数，希望将用户输入的值输入到输入字段中。我应该以某种方式从hbs模板传递它，还是应该从函数中的DOM中获取它。

有类似的东西吗？

{{ action myFunction $("#myInputId").val() }}

Answer 1

是的，您可以通过value的{{1}}属性执行此操作，如下所示：

action

以下是ember-twiddle。

Answer 2

您可以将输入框的值绑定到控制器属性，并且可以使用该属性在按钮操作中派生输入框的值。

以下是ember-twiddle。

注意：灰色控制器为 SINGLETONS 。

Answer 3

从概念上讲 - 你走在正确的轨道上。

在这种情况下......这是一条路线（申请路线）

import Ember from 'ember';

export default Ember.Route.extend({

  alertInput: function(inputValue) {
    alert(inputValue);
  },

  actions: {
    doSomething(userInput) { // (this is already a function)
    // alert(userInput); // or... use a regular function in the action
      this.get('alertInput')(userInput);
    },
  },

});

这是一个模板（应用程序模板）

{{input value=userInputProperty}}

<button {{action 'doSomething' userInputProperty}}>doSomething</button>

此操作采用函数名称 - 然后将值作为参数传递给函数。

根据您的目的，您可以通过几种方式做事。

https://ember-twiddle.com/3080649ecf98cddef6d3d64b186ba741?openFiles=templates.application.hbs%2C （旋转的好时机）

Answer 4

无法直接传递值，但您可以将值绑定到属性。我建议将输入包装在一个组件中，并将输入值绑定到一个组件属性。然后，您可以将值作为操作参数传递，或直接在组件的操作处理程序中访问它。该解决方案避免使用单一控制器，并且该组件可能可以重复使用。

另请参阅https://guides.emberjs.com/v2.18.0/templates/actions和https://guides.emberjs.com/v2.18.0/templates/input-helpers。

Ember hbs模板是否应该将参数从输入字段传递给函数，如果是这样的话？

4 个答案: