如何添加EJS代码到jquery追加功能?

Question

我有问题。我有动态的形式，与我需要从数据库的数据循环。

我在第一行有这个:

<select class="form-select" id="serviceName1" onchange="getServiceInfo('1')" name="serviceName">
<option selected value="none">Wybierz pozycję</option>
<% invServices.forEach(invServices => { %>
<option><%= invServices.services.name %></option>
<% }); %>
</select>

和这个复制:

$(wrapper).append(
"<select id='serviceName"+x+"' class='form-select' name='serviceName'>"+
"<option selected value='none'>Wybierz pozycję</option>"+
'<% invServices.forEach(invServices => { %>'+
"<option><%= invServices.services.name %></option>"+
"<% }); %>'"+
"</select>"+    )

这个复制部分<%= blah blah%>，在我的页面上呈现为字符串。

我可以使用这个标签<%%>使用jquery append?或者有人有更好的方法来做动态表单?

谢谢你的回答。

Answer 1

要从前端执行此操作(我假设这是您所要求的，因为您正在询问使用jQuery插入)，步骤如下:

1. 创建一个迷你的EJS模板(看起来你已经有了)
2. 从数据库中获取数据(如果你还没有在网页中拥有数据，可能会使用Ajax调用后端服务器)。
3. 导入EJS客户端库，使其可供客户端使用。然后，调用EJSejs.render()，传递模板和用于该模板的数据，以生成插入数据的HTML。
然后，使用jQuery将生成的HTML插入到您现有的页面中。

或者，您可以创建一个Ajax调用，它在服务器上执行步骤1-4，并为您返回生成的HTML，然后您将Ajax调用返回的生成的HTML插入到您想要它的页面中。