Question

我正在使用ejs模板引擎填充我页面上的数据。

我的json文件包含以下字段：

var PhotosSchema = new Schema({
  photo_url: {type: String},
  thumb_url: {type: String},
  hashtags: {type: [String]}
});

到目前为止，我有以下HTML代码：

<div class="thumbnail">
  <img src=<%= photo.thumb_url %> >
  <div class="caption">
    <p><% for(var i=0; i<photo.hashtags.length; i++) {%>
    <a href="http://example.com/<%=photo.hashtags[i]%>"><%=photo.hashtags[i] %></a>
    <% } %>
    | <a href="<%= photo.photo_url  %>">full resolution</a></p>
  </div>
</div>

它显示了照片下方的标签，但它们没有用逗号分隔。例如，它看起来像这样：

one two three

如何修改我的代码，以便将主题标签与,符号分开，但不会将此字符添加到末尾，例如：

one, two, three

这个不正确：

one, two, three,

Answer 1

针对您的特定用例，添加三元运算符。 i != photo.hashtags.length - 1 ? "," : ""

<div class="thumbnail">
    <img src=<%= photo.thumb_url %> >
    <div class="caption">

        <p><% for(var i=0; i<photo.hashtags.length; i++) {%>
        <a href="http://example.com/<%=photo.hashtags[i]%>">
            <%=photo.hashtags[i] %> <%= i != photo.hashtags.length - 1 ? "," : "" %>
        </a>
        <% } %>
        | <a href="<%= photo.photo_url  %>">full resolution</a></p>
    </div>
</div>

Answer 2

为除了最后一个元素之外的所有元素创建一个for循环，并在每个标签之后添加“，”。并在循环

之后单独执行最后一个hashtag

<div class="thumbnail">
        <img src=<%= photo.thumb_url %> >
        <div class="caption">
            <p><% for(var i=0; i<photo.hashtags.length - 1; i++) {%>
            <a href="http://example.com/<%=photo.hashtags[i]%>"><%=photo.hashtags[i] %>, </a>
            <% } %>
            <a href="http://example.com/<%=photo.hashtags[i+1]%>"><%=photo.hashtags[i] %>
            | <a href="<%= photo.photo_url  %>">full resolution</a></p>
        </div>
    </div>

如何在js / css中用逗号分隔数组中的字符串？

2 个答案: