title: How to structure dynamic event insertion for a calendar in angular
body: <p>I'm looking for a general outline of the best way to structure this type of logic in angular. </p>
  
  <p><strong>What I'm doing</strong></p>
  
  <p>I'm rending a calendar in HTML and need to insert event objects from a list of events in their respective day elements. </p>
  
  <p><strong>What I would do in jQuery</strong></p>
  
  <p>Using jquery in the past, I would first create a unique slug class for each day element like <code>class="day_01_12_2014"</code> during the calendar render. I would then loop through each event and insert the event by recreating the unique slug ie: <code>$('.day_'+e.day+'_'+e.month+'+'_'+e.year).append(event_html);</code></p>
  
  <p><strong>What I think* I want to do in angular</strong></p>
  
  <p>The only way I could imagine this is to basically have a bunch of scope aware day directives that basically 'listens' to the array of events and then inserts it into itself it one matches the date that it represents. What would this directive look like or am I thinking about this the wrong way?</p>
  
  <p>Is the loop and insert a viable method using angular? I feel like this is not angular's style. Or should I be using a directive to somehow know if an event inside an array is on it's own respective day?</p>
  
  <p>The directive I'm thinking would basically create a $watch($scope.events) and then loop though and render the html as necessary? Any other suggestions?</p>
  
  <p>Thanks!</p>