AngularJS DatePicker in ng-repeat - angularjs

Question

I am trying to get datepickers to display in a table using an ng-repeat. I have a begin date and end date. When I try to display both datepickers they display one over the other. Below is my code and a screenshot of what is happening.
<table datatable="ng" dt-options="dtOptions" dt-columns="dtColumns" class="table table-bordered">
<tbody>
<tr ng-repeat="waiver in model.waivers" >
<td class="input-group">
<input class="form-control" type="text" datepicker-popup="MM/dd/yyyy" ng-model="waiver.StartDate" is-open="waiver.isOpen" close-text="Close" />
<span class="input-group-btn">
<button class="btn btn-default" ng-click="open($event, waiver)"><i class="fa fa-calendar"></i></button>
</span>
</td>
<td class="input-group">
<input class="form-control" type="text" datepicker-popup="MM/dd/yyyy" ng-model="waiver.EndDate" is-open="waiver.isOpen" close-text="Close" />
<span class="input-group-btn">
<button class="btn btn-default" ng-click="open($event, waiver)"><i class="fa fa-calendar"></i></button>
</span>
</td>
<td><input type="text" ng-model="waiver.FuelCap" /></td>
<td><button type="button" ng-click="updateWaiver(waiver)" class="btn btn-warning"><i class="fa fa-refresh"></i></button></td>
<td><button type="button" ng-click="removeWaiver(waiver)" class="btn btn-danger"><i class="fa fa-trash-o"></i></button></td>
</tr>
</tbody>
</table>
Screenshot
Here is a quick plunkr example.
I know they are both opening when the open button is clicked but if you could help explain why they appear in the same column of the table.

Answer 1

It has to do with how bootstrap is styling the input-group. You need to not place that class on the td. Try moving it down a level like so:
<td>
<div class="input-group">
<input class="form-control" type="text" datepicker-popup="MM/dd/yyyy" ng-model="waiver.StartDate" is-open="waiver.isOpen" close-text="Close" />
<span class="input-group-btn">
<button class="btn btn-default" ng-click="open($event, waiver)">open</button>
</span>
</div>
</td>
<td>
<div class="input-group">
<input class="form-control" type="text" datepicker-popup="MM/dd/yyyy" ng-model="waiver.EndDate" is-open="waiver.isOpen" close-text="Close" />
<span class="input-group-btn">
<button class="btn btn-default" ng-click="open($event, waiver)">open</button>
</span>
</div>
</td>