fix(calendar): revert removal of workaround for virtual repeat issue

- #8585 turned out to not be a bug
- this restored code is not actually a workaround for a bug
  - but actually part of the implementation needed for `md-calendar`
- improve some types and JSDoc

Fixes #11919

Author: Splaktar

src/components/datepicker/js/calendar.js

@@ -36,7 +36,6 @@
   angular.module('material.components.datepicker')
     .directive('mdCalendar', calendarDirective);
 
-  // POST RELEASE
   // TODO(jelbourn): Mac Cmd + left / right == Home / End
   // TODO(jelbourn): Refactor month element creation to use cloneNode (performance).
   // TODO(jelbourn): Define virtual scrolling constants (compactness) users can override.
@@ -52,8 +51,13 @@
   function calendarDirective(inputDirective) {
     return {
       template: function(tElement, tAttr) {
+        // This allows the calendar to work, without a datepicker. This ensures that the virtual
+        // repeater scrolls to the proper place on load by deferring the execution until the next
+        // digest. It's necessary only if the calendar is used without a datepicker, otherwise it's
+        // already wrapped in an ngIf.
+        var extraAttrs = tAttr.hasOwnProperty('ngIf') ? '' : 'ng-if="calendarCtrl.isInitialized"';
         return '' +
-          '<div ng-switch="calendarCtrl.currentView">' +
+          '<div ng-switch="calendarCtrl.currentView" ' + extraAttrs + '>' +
             '<md-calendar-year ng-switch-when="year"></md-calendar-year>' +
             '<md-calendar-month ng-switch-default></md-calendar-month>' +
           '</div>';
@@ -151,7 +155,7 @@
     this.today = this.dateUtil.createDateAtMidnight();
 
     /** @type {!ngModel.NgModelController} */
-    this.ngModelCtrl = null;
+    this.ngModelCtrl = undefined;
 
     /** @type {string} Class applied to the selected date cell. */
     this.SELECTED_DATE_CLASS = 'md-calendar-selected-date';
@@ -162,7 +166,10 @@
     /** @type {string} Class applied to the focused cell. */
     this.FOCUSED_DATE_CLASS = 'md-focus';
 
-    /** @final {number} Unique ID for this calendar instance. */
+    /**
+     * @final
+     * @type {number} Unique ID for this calendar instance.
+     */
     this.id = nextUniqueId++;
 
     /**
@@ -203,16 +210,22 @@
      */
     this.lastRenderableDate = null;
 
+    /**
+     * Used to toggle initialize the root element in the next digest.
+     * @type {boolean}
+     */
+    this.isInitialized = false;
+
     /**
      * Cache for the  width of the element without a scrollbar. Used to hide the scrollbar later on
      * and to avoid extra reflows when switching between views.
-     * @type {Number}
+     * @type {number}
      */
     this.width = 0;
 
     /**
      * Caches the width of the scrollbar in order to be used when hiding it and to avoid extra reflows.
-     * @type {Number}
+     * @type {number}
      */
     this.scrollbarWidth = 0;
 
@@ -335,6 +348,10 @@
         self.displayDate = self.selectedDate || self.today;
       }
     };
+
+    self.$mdUtil.nextTick(function() {
+      self.isInitialized = true;
+    });
   };
 
   /**

src/components/datepicker/js/calendarMonthBody.js

@@ -47,7 +47,10 @@
    * @ngInject @constructor
    */
   function CalendarMonthBodyCtrl($element, $$mdDateUtil, $mdDateLocale) {
-    /** @final {!angular.JQLite} */
+    /**
+     * @final
+     * @type {!JQLite}
+     */
     this.$element = $element;
 
     /** @final */
@@ -65,7 +68,7 @@
     /**
      * Number of months from the start of the month "items" that the currently rendered month
      * occurs. Set via angular data binding.
-     * @type {number}
+     * @type {number|null}
      */
     this.offset = null;
 

src/components/datepicker/js/calendarYearBody.js

@@ -37,7 +37,10 @@
    * @ngInject @constructor
    */
   function CalendarYearBodyCtrl($element, $$mdDateUtil, $mdDateLocale) {
-    /** @final {!angular.JQLite} */
+    /**
+     * @final
+     * @type {!JQLite}
+     */
     this.$element = $element;
 
     /** @final */
@@ -55,7 +58,7 @@
     /**
      * Number of months from the start of the month "items" that the currently rendered month
      * occurs. Set via angular data binding.
-     * @type {number}
+     * @type {number|null}
      */
     this.offset = null;