Can I join the output of a loop with Liquid?

Question

I'm looking to output something like: data-tags="[tag1, tag2, tag3]" but instead, I'm getting data-tags:[tag1tag2tag3]. Am I using join incorrectly?

Code:

data-tags="{% for tag in subtask.tags %}{{tag.title | slugify | join ', '}}{% endfor %}">

Answer 1

Try this:

data-tags="{% for tag in subtask.tags %}{{ tag.title | slugify }}{% unless forloop.last %}, {% endunless %}{% endfor %}">

If you didn't need to slugify the title you could do:

{% assign tags = subtask.tags | map: title %}
<div data-tags="{{ tags | join: ', ' }}">

This is because the join filter can only be applied to an array not the value of the array.