Month Date Widget

For month summary view.

by merganser

HTML

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap.min.css">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css">
<script src="https://code.jquery.com/jquery-1.11.3.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/js/bootstrap.min.js"></script>
<div data-monthdaypicker id="hellopicker">Hello</div>

    
  
<my:watch exp="name"></my:watch>

JavaScript

angular.widget('my:watch', function(compileElement) {
 var compiler = this;
 var exp = compileElement.attr('exp');
 return function(linkElement) {
   var currentScope = this;
   currentScope.$watch(exp, function(value){
     alert(value);
   });
 };
});



angular.module('dropdowntabfiddle', [])
        .directive('monthdaypicker', monthdaypicker);

    monthdaypicker.$inject = ['$rootScope', '$timeout', '$window', '$compile'];
    function monthdaypicker ($rootScope, $timeout, $window, $compile) {

				var directive = {
            link: link,
            restrict: 'A',
            replace: true
            
        };
        return directive;
        

        function link(scope, element, attrs) {   
        
        	var $picker = element;
                  element.html(gettemplate(scope, element));
      						$compile(element.contents());
          
        }
        
				function gettemplate(scope, element) {
        	var tpl = [
          '<h4>hi</h4>'
          ];
          
          
          
          
          
          return tpl.join('');
				}
        
   }