Question

我对Ember很陌生，似乎无法理解正在发生的事情。

我的组件中有两个输入

{{input click=(action "getIdAndValue") type="range" min="0" max="100" value="flow_q1"}}

{{input click=(action "getIdAndValue") type="range" min="0" max="100" value="flow_q2"}}

在我的.js我想要获得每个输入的id和值。

getIdAndValue: function(value){
    this._super(...arguments);    
    console.log("element id: " + this.$('input').attr("id"));
}

余烬生成这两个id 输入1：id = ember689，输入2：id = ember690

当我点击其中任何一个时，函数返回ember689。 HTML中没有其他输入。我怎样才能抓住个人身份？和价值？

Answer 1

由于您使用了闭包动作（event），您将收到getIdAndValue: function(event) { let id = event.target.id; let value = event.target.value; }对象作为第一个参数：

<input>

另请注意，如果您不需要实时绑定，我建议您使用普通的HTML {{input}}代替<input onclick={{action "getIdAndValue"}} type="range" min="0" max="100" value="flow_q1" />帮助：

value="flow_q1"

此外，我不确定您希望通过flow_q1实现目标。如果您要访问名为value=flow_q1的媒体资源，则在使用普通HTML {{input}}时使用value={{flow_q1}}帮助程序和<input>时应该var idArray = [ RevisionDate, SupplierPartInformationEffectiveDate, SupplierPartInformationExpirationDate ]; var attrIDArray = ["RevisionDate", "SupplierPartInformationEffectiveDate", "SupplierPartInformationExpirationDate"]; var stringIDArray = ["#RevisionDate", "#SupplierPartInformationEffectiveDate", "#SupplierPartInformationExpirationDate"]; for (i = 0; i < idArray.length; i++) { var value = document.getElementById(attrIDArray[i]).value; var day = value.substring(8, 10); var month = value.substring(4, 7); var year = value.substring(11, 15); var timeFormat = day + " " + month + " " + year; if (value == "") { timeFormat = "N/A"; } $(stringIDArray[i]).replaceWith("<div id='" + attrIDArray[i] + "' class='col-md-12 margin-bottom-10px pad-L-15px border-1px pad-LR-3px pad-TB-2px darkgrey-border-1px' /></div>"); if (stringIDArray[i] === "#RevisionDate") { $("#RevisionDate").css("width", "227px"); } else { $("#SupplierPartInformationEffectiveDate").css("width", "342px"); $("#SupplierPartInformationExpirationDate").css("width", "342px"); } $(stringIDArray[i]).html(timeFormat); }。< / p>

Answer 2

Ember为每个组件生成id，因此在添加新组件和字段时它将始终更改。要获取输入组件的值，您必须将一个变量赋值给value字段，然后您可以访问该变量以获取输入值如下：

{{input type="range" min="0" max="100" value=value1}}

{{input type="range" min="0" max="100" value=value2}}

然后您可以在组件中使用this.get('value1')来检索值。

Answer 3

按照勒克斯的回答，这是要走的路。

1.在getIdAndValue中，您不需要调用this._super（... arguments）。只有当我们覆盖ember内置方法或调用父对象方法时，我们才会包含超级调用。

2.在您的示例中，this.$('input')这将返回包含您包含的2个元素的数组。创建了sample twiddle来解释这一点。

3.忘记你甚至可以将id值发送给input帮助者。

{{input click=(action "getIdAndValue") type="range" id="startRange" min="0" max="100" value="flow_q1"}}

组件为相同类型的元素返回相同的ID

3 个答案: