src/components/datepicker/js/calendarMonthBody.js
function mdCalendarMonthBodyDirective($compile, $$mdSvgRegistry) {
    var ARROW_ICON = $compile('<md-icon md-svg-src="' +
      $$mdSvgRegistry.mdTabsArrow + '"></md-icon>')({})[0];

    return {
      require: ['^^mdCalendar', '^^mdCalendarMonth', 'mdCalendarMonthBody'],
      scope: { offset: '=mdMonthOffset' },
      controller: CalendarMonthBodyCtrl,
      controllerAs: 'mdMonthBodyCtrl',
      bindToController: true,
      link: function(scope, element, attrs, controllers) {
        var calendarCtrl = controllers[0];
        var monthCtrl = controllers[1];
        var monthBodyCtrl = controllers[2];

        monthBodyCtrl.calendarCtrl = calendarCtrl;
        monthBodyCtrl.monthCtrl = monthCtrl;
        monthBodyCtrl.arrowIcon = ARROW_ICON.cloneNode(true);

        // The virtual-repeat re-uses the same DOM elements, so there are only a limited number
        // of repeated items that are linked, and then those elements have their bindings updated.
        // Since the months are not generated by bindings, we simply regenerate the entire thing
        // when the binding (offset) changes.
        scope.$watch(function() { return monthBodyCtrl.offset; }, function(offset) {
          if (angular.isNumber(offset)) {
            monthBodyCtrl.generateContent();
          }
        });
      }
    };
  }
function mdCalendarMonthBodyDirective($compile, $$mdSvgRegistry) {
    var ARROW_ICON = $compile('<md-icon md-svg-src="' +
      $$mdSvgRegistry.mdTabsArrow + '"></md-icon>')({})[0];

    return {
      require: ['^^mdCalendar', '^^mdCalendarMonth', 'mdCalendarMonthBody'],
      scope: { offset: '=mdMonthOffset' },
      controller: CalendarMonthBodyCtrl,
      controllerAs: 'mdMonthBodyCtrl',
      bindToController: true,
      link: function(scope, element, attrs, controllers) {
        var calendarCtrl = controllers[0];
        var monthCtrl = controllers[1];
        var monthBodyCtrl = controllers[2];

        monthBodyCtrl.calendarCtrl = calendarCtrl;
        monthBodyCtrl.monthCtrl = monthCtrl;
        monthBodyCtrl.arrowIcon = ARROW_ICON.cloneNode(true);

        // The virtual-repeat re-uses the same DOM elements, so there are only a limited number
        // of repeated items that are linked, and then those elements have their bindings updated.
        // Since the months are not generated by bindings, we simply regenerate the entire thing
        // when the binding (offset) changes.
        scope.$watch(function() { return monthBodyCtrl.offset; }, function(offset) {
          if (angular.isNumber(offset)) {
            monthBodyCtrl.generateContent();
          }
        });
      }
    };
  }
function mdCalendarMonthBodyDirective ( $compile , $$mdSvgRegistry ) { var ARROW_ICON = $compile ( '<md-icon md-svg-src="' + $$mdSvgRegistry . mdTabsArrow + '"></md-icon>' ) ( { } ) [ 0 ] ; return { require : [ '^^mdCalendar' , '^^mdCalendarMonth' , 'mdCalendarMonthBody' ] , scope : { offset : '=mdMonthOffset' } , controller : CalendarMonthBodyCtrl , controllerAs : 'mdMonthBodyCtrl' , bindToController : true , link : function ( scope , element , attrs , controllers ) { var calendarCtrl = controllers [ 0 ] ; var monthCtrl = controllers [ 1 ] ; var monthBodyCtrl = controllers [ 2 ] ; monthBodyCtrl . calendarCtrl = calendarCtrl ; monthBodyCtrl . monthCtrl = monthCtrl ; monthBodyCtrl . arrowIcon = ARROW_ICON . cloneNode ( true ) ; // The virtual-repeat re-uses the same DOM elements, so there are only a limited number // of repeated items that are linked, and then those elements have their bindings updated. // Since the months are not generated by bindings, we simply regenerate the entire thing // when the binding (offset) changes. scope . $watch ( function ( ) { return monthBodyCtrl . offset ; } , function ( offset ) { if ( angular . isNumber ( offset ) ) { monthBodyCtrl . generateContent ( ) ; } } ) ; } } ; }
Private directive consumed by md-calendar-month. Having this directive lets the calender use
md-virtual-repeat and also cleanly separates the month DOM construction functions from
the rest of the calendar controller logic.
@ngInject
Private directive consumed by md - calendar - month . Having this directive lets the calender use md - virtual - repeat and also cleanly separates the month DOM construction functions from the rest of the calendar controller logic .