Question

假设我将以下属性传递到下划线模板：name和animaltype。我也有一个根据动物类型而变化的属性。因此，例如，如果animaltype是CAT，则该属性称为cat_id。如果动物类型是DOG，则属性为dog_id，依此类推。

我为每个动物类型id创建一个输入框，但只应填充具有相应动物类型id的框（在via属性中映射）。这个ID输入框是我无法映射到属性值的那个，因为我使用javascript来创建应该期待的属性的名称。因此，正在插入实际的javascript变量名称，而不是与javascript变量名称匹配的相应已解析属性值。

这是小提琴http://jsfiddle.net/leopardy/fev4vqmg/1/

我应该得到的是什么名称：蓬松
类型：CAT
CAT ID：005
狗号：
BIRD ID：

我真正得到的是名称：蓬松
类型：CAT
CAT ID：cat_id
狗号：
BIRD ID：
其中cat_id属性未在模板中解析。

作为旁注，在我的真实代码中，我隐藏了与动物类型不对应的其他ID输入框，但为了保持简单，我没有包括隐藏/展示。

Answer 1

实际上非常直接

EDIT 使用参数[0] [typeId]

 <input value="<%= arguments[0][typeID] %>" name=<%= (key).toLowerCase() +"_id"%> type="text"/>

即使没有人对你尖叫，也不要使用eval;）这是工作小提琴的链接：http://jsfiddle.net/j872q5gm/1/

感谢@Adrian Lynch提醒我成为一名优秀的JS公民;）

Answer 2

你有共同的＆＃34;我在另一个变量中有一个变量名＆＃34;问题和解决方案与以往一样：在查找表（即JavaScript中的对象）中按名称查找需要查找的内容。

在您的情况下，我不会_.extend(attributes, {animalTypes:animalTypes});将所有内容混合成一堆，我会将attributes和animalTypes分开，以便您的_.template电话看起来像这样：

var tmpl = _.template(template);
var html = tmpl({
    animalTypes: animalTypes,
    attributes: attributes
});

现在，您可以在模板中说出attributes['cat_id']之类的内容。当然，您必须通过animalTypes或attributes来引用所有内容，但这非常小。您的模板看起来像这样：

<table>
    <tbody>
            <tr>
                <td>Name:</td>
                <td>
                    <input name="name" type="text" value="<%= attributes.name %>"/>
                </td>
            </tr>
            <tr>
                <td>Type:</td>
                <td>
                    <input name="animal_type" type="text" value="<%= attributes.animaltype %>"/>
                </td>
           </tr>
           <% for (var key in animalTypes) { %>
               <% var typeID= (key).toLowerCase() +"_id" %>
               <tr>
                   <td><%= key %> ID:</td>
                   <% if (attributes.animaltype === key) { %> 
                       <td>
                           <input value="<%= attributes[typeID] %>" name="<%= typeID %>" type="text"/>
                       </td>
                   <% } else { %>
                       <td>
                           <input value="" name="<%= typeID %>" type="text"/>
                       </td>
                   <% } %>
               </tr>
           <% } %>
    </tbody>
</table>

解决您当前问题的部分是：

<input value="<%= attributes[typeID] %>" name="<%= typeID %>" type="text"/>

更新了演示：http://jsfiddle.net/ambiguous/qj3ru1mL/1/

如何将javascript变量解释为下划线模板中的属性

2 个答案: