2016-11-29 32 views
1

Ich benutze eckige 1.6, Material Design 1.1.1, während mit dem Datepicker, genau wie sie in ihrer Dokumentation sagt, bekomme ich ein leeres Fenster beim Klicken auf den Datepicker, es zeigt nur die Tage Buchstabe (SSMTWTF) und nur beim Scrollen innerhalb dieses Fensters werden die Daten angezeigt. Irgendwelche Vorschläge?Eckiges Material Design datepicker

dank
<md-input-container flex> 
    <label>Pick a date</label> 
    <md-datepicker ng-model="myDate" name="dateField" md-min-date="minDate" 
      md-max-date="maxDate"></md-datepicker> 

    <div ng-messages="myOtherForm.dateField.$error"> 
      <div ng-message="valid">The entered value is not a date!</div> 
      <div ng-message="required">This date is required!</div> 
      <div ng-message="mindate">Date is too early!</div> 
      <div ng-message="maxdate">Date is too late!</div> 
    </div> 
</md-input-container> 

JS:

var app = angular.module('StarterApp', ['ngMaterial', 'ngMdIcons', 'ngMessages']); 

app.controller('AppCtrl', function($timeout , $scope){ 

    $scope.myDate = new Date(); 

    $scope.minDate = new Date(
     $scope.myDate.getFullYear(), 
     $scope.myDate.getMonth() - 2, 
     $scope.myDate.getDate()); 

    $scope.maxDate = new Date(
     $scope.myDate.getFullYear(), 
     $scope.myDate.getMonth() + 2, 
     $scope.myDate.getDate()); 

    $scope.onlyWeekendsPredicate = function(date) { 
    var day = date.getDay(); 
    return day === 0 || day === 6; 
    }; 

}); 
+0

Bitte fügen Sie ein Code-Schnipsel oder JS Geige Link –

+0

Hey Nobal, danke, Schnipsel auf die Frage –

+0

Dank hinzugefügt. Bitte fügen Sie auch den JS-Teil hinzu –

Antwort

1

Sieht aus wie es ist ein Fehler in 1.6.x RC-Versionen ist. Verwenden Sie stattdessen Angular 1.5.9 und hier ist ein funktionierendes Beispiel.

var myDate = new Date(2016, 11, 3); 

    $scope.minDate = new Date(
     myDate.getFullYear(), 
     myDate.getMonth() - 2, 
     myDate.getDate()); 

    $scope.maxDate = new Date(
     myDate.getFullYear(), 
     myDate.getMonth() + 2, 
     myDate.getDate()); 

    $scope.onlyWeekendsPredicate = function(date) { 
    var day = date.getDay(); 
    return day === 0 || day === 6; 
    }; 

http://codepen.io/samithaf/pen/XNzwMP

+0

Github Problem hier: https://github.com/angular/material/issues/10070 – domenu

Verwandte Themen