Basic Calendar

http://angularjs.org/

by Edward Tanguay

HTML

<script src="http://code.angularjs.org/angular-1.0.1.js"></script>
<script src="http://codeorigin.jquery.com/ui/1.10.2/jquery-ui.min.js"></script>
<div ng-controller="mainApp">
    datepicker: <input calendar ng-model='startDate' />
    <div>The date picked is: {{startDate}}</div>
    <input id="thedate"/>
</div>

JavaScript

var myApp = angular.module('myApp',[]);

myApp.directive('calendar', function () {
    return {
        require: 'ngModel',
        link: function (scope, el, attr, ngModel) {
            $(el).datepicker({
                dateFormat: 'yy-mm-dd',
                onSelect: function (dateText) {
                    scope.$apply(function () {
                        ngModel.$setViewValue(dateText);
                    });
                }
            });
        }
    };
});

function mainApp($scope) {
    
}



$(function() {
   $('thedate').css('background-color','red');
});