Date Picker Directives

mbDatepicker

app.directive('mbDatepicker', function() {
		'use strict';
		return {
			restrict: 'AE',
			replace:true,
			scope :{
				mbModel : '=',
				mbDpConfig: '=',
				label : '@',
				mbId: '='
			},
			template : 	'<div class="dropdown">'+
			'<md-input-container>'+
			'	<label>{{label || \'Date\'}}</label>'+
			'	<input  id="{{mbId}}" ng-model="mbModel" click-anywhere-but-here  ng-focus="showdatepicker = true" tabindex="1">'+
			'</md-input-container>'+
			'<ul class="dropdown-menu noselect" role="menu" aria-labelledby="dLabel" ng-show="showdatepicker" >'+
			'	<datetimepicker data-ng-model="mbModel" data-datetimepicker-config="mbDpConfig || \'\'" on-set-time="showdatepicker = false;" />'+
			'</ul>'+
			'</div>',
			link : function (scope, element, attrs) {
				scope.mbId = attrs.mbId;
				$(element).find('input').bind('focus',function () {
					scope.showdatepicker = true;
					scope.$apply(scope.showdatepicker);
				});
				$(element).bind('blur', function(){
					scope.showdatepicker = false;
					scope.$apply(scope.showdatepicker);
				});
			}
		};
	});