如何禁用角材料週末的DateTimePicker

我採用了棱角分明的材料的DateTimePicker https://github.com/logbon72/angular-material-datetimepicker 如何禁用角材料週末的DateTimePicker

我想禁用角材料的DateTimePicker週末和週三日期

<input time="false" date="true" mdc-datetime-picker type="text" id="date" placeholder="Date" ng-model="date" min-date="minDate" max-date="maxDate" disable-dates="dates">

我可以禁用特定日期看下面的代碼

$scope.dates = [new Date('2017-04-14T00:00:00'), new Date('2017-04-20T00:00:00'), 
     new Date('2017-04-24T00:00:00'), new Date('2017-04-25T00:00:00'), new Date('2017-04-03T00:00:00'), 
     new Date('2017-04-30T00:00:00')];

請幫幫我。任何幫助，應該感激。提前致謝。

來源

2017-04-06 saravana

特別感謝Salih改變它。經過長時間的鍛鍊，我得到了答案。它可以幫助其他人。這是我的代碼。

此代碼將禁用週三日期高達1年

$scope.dates = []; 

function getDates(year, month, day) { 

      var date = new Date(year, month, day); 

      while (date.getDay() != 3) { // 3 refers to Wednesday and 0 refers to Sunday 
       date.setDate(date.getDate() + 1); 
      } 

      for (var i = 0; i < 52; ++i) { //52 refers to total weeks in a year 

       var m = date.getMonth() + 1; 
       var d = date.getDate(); 

       if(m === 12) { // if month is December 

        var year = date.getFullYear()+1; // increment to next year current year is 2017 we increment to 2018 

        var lastyear = year - 1;  
        var setdate = lastyear + '-' + (m < 10 ? '0' + m : m) + '-' + (d < 10 ? '0' + d : d)+'T00:00:00'; 
        var finaldate = new Date(setdate); 
        $scope.dates.push(finaldate); // December dates pushing to array 

       } else { 

        var setdate = year + '-' + (m < 10 ? '0' + m : m) + '-' + (d < 10 ? '0' + d : d)+'T00:00:00'; 
        var finaldate = new Date(setdate); 
        $scope.dates.push(finaldate); //all dates pushing to array except December 

       } 

       date.setDate(date.getDate() + 7); 
      } 

} 

var todaydate = new Date(); 
var getdate = getDates(todaydate.getFullYear(), todaydate.getMonth(), todaydate.getDate()); // call function 
console.log($scope.dates); // here is your result

好運。乾杯！！

來源

2017-04-06 12:37:18 saravana

你不能直接禁止他們，你需要某種過濾器之類的東西下面，使他們殘疾

angular.module('datepickerBasicUsage', ['ngMaterial']) 
 
.controller('AppCtrl', function ($scope) { 
 
    $scope.myDate = new Date(); 
 
    $scope.onlyWeekendsPredicate = function(date) { 
 
    var day = date.getDay(); 
 
    return day === 1 || day === 2 || day === 3 || day === 4 || day === 5; 
 
    
 
    }; 
 
});

<!doctype html> 
 
<html ng-app="datepickerBasicUsage"> 
 
    <head> 
 
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.4/angular.js"></script> 
 
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.4/angular-animate.min.js"></script> 
 
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.4/angular-aria.min.js"></script> 
 
    <script src="https://cdnjs.cloudflare.com/ajax/libs/angular-material/1.0.4/angular-material.js"></script> 
 
    <script src="https://s3-us-west-2.amazonaws.com/s.cdpn.io/t-114/assets-cache.js"></script> 
 
    
 
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/angular-material/1.0.4/angular-material.css"> 
 
    
 
    <script src="app.js"></script> 
 
    </head> 
 
    <body> 
 

 
    <div ng-controller="AppCtrl" style='padding: 40px;'> 
 
    
 
    
 
    
 
    <div layout-gt-xs="row"> 
 
    <div flex-gt-xs=""> 
 
     <h4>Only weekends disabled</h4> 
 
     <md-datepicker ng-model="myDate" md-placeholder="Enter date" md-date-filter="onlyWeekendsPredicate"></md-datepicker> 
 
    </div> 
 
    
 
    </div> 
 
    </div> 
 
    </body> 
 
</html>

來源

2017-04-06 07:32:41

你應該寫返回所有周末和週三在一年內功能，所以它可以被設定爲$scope.dates

這是一個有用的答案，它發現一年中的所有星期日。您可以根據自己的需要

Stackoverflow Answer

來源

2017-04-06 07:38:36

謝謝@salih Senol這些鏈接幫助了我。我改變了代碼取決於我的要求。我會在這裏發佈我的代碼。 – saravana

不客氣。乾杯:) –

如何禁用角材料週末的DateTimePicker

回答

相關問題