PrimeNG日历 - 无法禁用日期或日期

-1

我正在使用Angular 2并试图获得PrimeFaces日历日期选择器，以允许禁用特定的日子（节假日）以及周末。PrimeNG日历 - 无法禁用日期或日期

https://www.primefaces.org/primeng/#/calendar

其文档说我应该能够做到两者并给出了一个我一直试图实现的例子。但是，没有日期会被禁用！

在我的组件的模板：

<p-calendar [(ngModel)]="requestedShipDate" name="requestedShipDate" 
         [disabledDates]="restrictedShipDates" [disabledDays]="[0,6]"></p-calendar>

在我的组件类（一些样本初始化代码，我不能去上班）：

export class OrdersNewComponent implements OnInit { 
    requestedShipDate: Date; 
    restrictedShipDates: Array<Date>; 

    ngOnInit() { 
    let today = new Date(); 
    let invalidDate = new Date(); 
    invalidDate.setDate(today.getDate() - 1); 
    this.restrictedShipDates = [today,invalidDate]; 
    } 
}

有不是更好角2日历datepicker在那里，允许禁用特定的日期？（不只是minDate和maxDate）？这是我用这个功能找到的唯一一个，它当然不适合我！

而如果它是与一些incompatabile包或东西的问题，下面是我的project.json依赖关系：

"dependencies": { 
"@angular/common": "2.4.2", 
"@angular/compiler": "2.4.2", 
"@angular/core": "2.4.2", 
"@angular/flex-layout": "2.0.0-beta.3", 
"@angular/forms": "2.4.2", 
"@angular/http": "2.4.2", 
"@angular/material": "2.0.0-beta.2", 
"@angular/platform-browser": "2.4.2", 
"@angular/platform-browser-dynamic": "2.4.2", 
"@angular/router": "3.4.2", 
"angular2-select": "1.0.0-alpha.12", 
"core-js": "2.4.1", 
"hammerjs": "2.0.8", 
"jsrsasign": "6.1.1", 
"jwt-decode": "2.1.0", 
"lodash": "4.16.4", 
"material-design-lite": "1.2.1", 
"moment": "2.15.1", 
"ng2-pagination": "0.5.1", 
"ng2-translate": "4.0.0", 
"normalize.css": "4.2.0", 
"primeng": "1.1.4", 
"rxjs": "5.0.3", 
"ts-helpers": "1.1.1", 
"xmljson": "0.2.0", 
"zone.js": "0.7.4" 
}, 
    "devDependencies": { 
    "@angular/compiler-cli": "2.4.2", 
    "@types/jasmine": "2.5.38", 
    "@types/lodash": "4.14.37", 
    "@types/node": "6.0.42", 
    "angular-cli": "1.0.0-beta.25.5", 
    "angular2-perfect-scrollbar": "^2.0.6", 
    "codelyzer": "^2.0.0-beta.4", 
    "jasmine-core": "2.5.2", 
    "jasmine-spec-reporter": "2.5.0", 
    "karma": "1.2.0", 
    "karma-chrome-launcher": "2.0.0", 
    "karma-cli": "1.0.1", 
    "karma-jasmine": "1.0.2", 
    "karma-remap-istanbul": "0.2.1", 
    "protractor": "4.0.13", 
    "ts-node": "1.2.1", 
    "tslint": "4.3.0", 
    "typescript": "2.0.10" 
    }

来源

2017-07-03 JzInqXc9Dg

-1

按照documentation，看来您可以禁用特定的日期和/或天像这样：

<p-calendar [(ngModel)]="dateValue" [disabledDates]="invalidDates" [disabledDays]="[0,6}" readonlyInput="readonlyInput">></p-calendar>

EDIT

ř解决这个问题。我的错！虽然你的格式是正确的，还是文档错误？您的disabledDays格式如下：[disabledDays]="[0,6]"，他们是这样的：[disabledDays]="[0,6}"。你的思想是自反的，但这可能是一个可能的错误？

希望它有帮助！

Additional Source

来源

2017-07-03 22:17:53 cosinepenguin

这基本上是我在我的问题已经给的代码。又名不适合我的代码。 :( – JzInqXc9Dg

对不起！我通过查看其他类似的SO问题/答案困惑自己！说到，你可能会在这里找到一些帮助：https://stackoverflow.com/questions/40082224/angular-2-datepicker-component-that- enable-to-disable-specific-dates他们对其他Angular2服务有很好的建议。祝你好运！ – cosinepenguin

你可以看看Angular Material代替PrimeNG。

您可以使用日期验证来筛选您不想允许的日期。函数返回值true将指示有效的日期。

这肯定会比使用PrimeNG更多的工作，但如果他们的日期选择器没有做到你想要的，你必须妥协。因此，对于这个

，你可以有像

filterUnwantedDates = (date: Date) => { 
    return !listOfDates.contains(date) // or something along those lines. 
    // look into lodash/underscore to help with this. 
}

来源

2017-07-04 00:01:39 SaxyPandaBear

PrimeNG日历 - 无法禁用日期或日期

回答

相关问题