JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://code.jquery.com/jquery-1.11.2.min.js"></script>
<link rel="stylesheet" href="https://code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css">
<script src="https://code.jquery.com/ui/1.11.4/jquery-ui.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
<div ng-app="myApp">
<div ng-controller="mainController">
    {{Me}}
    <div class="form-group" show-errors>
      <div datefield class="input-group date">
             <div class="input-group-content">
               <input  type="text" name="StartDate" class="form-control" ng-model="startDate" readonly="readonly" style="cursor:pointer;" required>
        </div>
        <span class="input-group-addon"><span class="glyphicon glyphicon-calendar"></span></i></span>
      </div>
    </div>
</div>
</div>

CSS

body {
    padding: 30px;
}

JavaScript

var app=angular.module('myApp', [])
app.controller('mainController', function($scope) {
    $scope.Me="Test";
});
app.directive('datefield', function () {
    return {
        restrict: 'AC',
        link: function (scope, element, attrs) {
            var $j = jQuery.noConflict();
            element.datepicker({ autoclose: true, todayHighlight: true });
        }
    }
});