title: How to create a grid that resembles a list/stack UX?
body: <p>Hello guys i am new to angular 2  and frontend in general and i would like to know what html component can i use for creating a visual list/stack whose elements can be  added or removed on click.All changes should update the visual list.</p>
  
  <p>e.g Basically i want the user to "add" items of N kinds </p>
  
  <pre><code>1 2 3....N
  </code></pre>
  
  <p>For each press on 1/2/3/....N the list appends an item of the added kind.The user can see the state of the list and he can press on any element of the list and remove it.</p>
  
  <p>For pressing 1->2->1->1 the list has to show visually something like:</p>
  
  <pre><code>1 2 1 1
  </code></pre>
  
  <p>If user presses on the second element (of type 2 in our case)  and then presses a delete button the list shrinks becoming.</p>
  
  <pre><code>1 1 1
  </code></pre>
  
  <p>The order of adding and deleting counts.The visual list has to get updated on each changed element.</p>
  
  <p>The length of the List cannot get very large (7-10 items max) but i have to find a way to show all possible item options  which can get quite big.
  Also <a href="https://i.stack.imgur.com/O33IB.png" rel="nofollow noreferrer">enter image description here</a>how should this be managed UI-wise?</p>
  
  <p><strong>Sketch</strong>:</p>
  
  <p><a href="https://i.stack.imgur.com/O33IB.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/O33IB.png" alt="enter image description here"></a></p>