title: Angular 5 - content between component tags
body: <p>I made a custom modal for my Angular 5 app, but I want to be able to edit the content in it.</p>
  
  <p>As example I have the following bit of code</p>
  
  <pre><code>&lt;app-modal&gt; &lt;p&gt;Some Text!&lt;/p&gt; &lt;/app-modal&gt;
  </code></pre>
  
  <p>I want the modal to take the <code>&lt;p&gt;</code> tag and put it like this:</p>
  
  <pre><code>&lt;div class="modal"&gt;
    &lt;div class="card"&gt;
  
      &lt;p&gt;Some Text!&lt;/p&gt;
  
    &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>So I can easily reuse the modal component and easily use it everywhere I need it. But I couldn't find if/how this works anywhere. If it's not possible, then I wonder what the next best way is.</p>
  
  <p>Thanks in advance!</p>