title: A way to insert a # in front of a variable of the html attribute value data-bs-target
body: <p>So basically, I have a vue web app and created a container with multiple bootstrap cards. The cards have a button, which collapses a form I've made for guests to apply. However, when I press the button of a card, it collapses the apply form of all cards at once. To fix that, I have to give each individual card a specific <code>id</code> which matches the <code>data-bs-target</code> and <code>aria-controls</code> of the button. So far, so good.</p>
  <p>I've made a variable <code>card_id</code> and inserted it into the attribute values with <code>v-bind</code>, but it's not working. The reason is, that the attribute <code>data-bs-target</code> needs a hashtag before the actual variable name, but I can't figure out a way to do that.</p>
  <p>Code sample:</p>
  <pre><code>    &lt;button class=&quot;btn btn-primary&quot; type=&quot;button&quot; data-bs-toggle=&quot;collapse&quot; :data-bs-target=&quot;card_id&quot; aria-expanded=&quot;false&quot; :aria-controls=&quot;card_id&quot;&gt;Apply now!&lt;/button&gt;
  &lt;div class=&quot;collapse&quot; :id=&quot;card_id&quot;&gt;
      &lt;div class=&quot;card card-body&quot;&gt;
        &lt;GuestForm&gt;&lt;/GuestForm&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  <p>I obviously can't just put a hashtag in front of the variable, so what is my next best solution for this?
  Thank you in advance.</p>