如何在剑道日期选择器中将过去的日期显示为禁用日期

2023-12-07

嗨我正在使用Kendo Angular UI 的 Kendo 日期选择器。我使用日期选择器的 min 和 max 属性来限制用户从特定的日期范围中进行选择。但这完全隐藏了超出范围的日期,就像这样。

enter image description here

相反,我想将它们显示为禁用状态,就像 2 月 29 日被禁用一样。再次,这已被禁用剑道的这个API

这里最好的情况是使用 min 和 max,因为它提供内置验证,但是当我们无法从外部 CSS 控制它们时,因为 DOM 元素本身不会生成任何日期,而是显示以下标签

<td class="k-empty">&nbsp;</td>

这是我在 HTML 中所做的

  <kendo-datepicker [id]="getId('startDate')"
                            [formatPlaceholder]="{ year: 'YYYY', month: 'MM', day: 'DD' }"
                            [navigation]="false" [min]="minimumDate"
                            (open)="onDatePickerOpen()" formControlName="startDate"></kendo-datepicker>

这里 Open Datepicker 函数根据业务逻辑禁用了一些日期,例如 2 月 29 日被禁用。

如何在仍然遵循最小-最大日期范围 API 的同时实现这种禁用的外观?


min and max属性隐藏超出范围的日期,因此要禁用您可以使用disabledDates的指令kendo-datepicker

<kendo-datepicker
      [(ngModel)]="value"
      [disabledDates]="disabledDates"
    >
</kendo-datepicker>

TS:

public disabledDates = (date: Date): boolean => {
    return date < this.minimumDate;
}

工作演示链接

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

如何在剑道日期选择器中将过去的日期显示为禁用日期 的相关文章

  • Rxjs 订阅方法被忽略

    在将其标记为重复之前 请注意这些都不适合我 问题1 https stackoverflow com questions 38142278 subscribe method is not triggered with rxjs 问题2 htt
  • Ionic2 + Angular2 - 带有离子图标星的动态速率值

    我正在尝试构建一个从 0 到 5 颗星的简单动态速率 及其中间值 如 x 5 示例 4 5 该速率从 javascript 接收值 我用 ngFor 寻找一些东西 但我不明白它是如何工作的 有人可以解释 帮助我吗 如果有帮助的话 对于 io
  • Ionic CSS 类分配

    我正在设计我的应用程序 熟悉基本的主题组件 SASS 等 但有一件突出且没有意义的事情是为什么当我在正在运行的应用程序中预览源代码时会添加大量额外的 CSS 类 就我而言 我只是想更改菜单标题背景 在我的 app html 文件中 我有
  • Angular 4 ExpressionChangedAfterItHasBeenCheckedError 错误

    在父组件中 gt ExpressionChangedAfterItHasBeenCheckedError Expression has changed after it was checked Previous value Current
  • NG2:angular2-webpack-starter - HMR 的目的是什么?

    我正在清理我的 angular2 项目 出于多种原因 我决定从种子开始 This one https github com AngularClass angular2 webpack starter 该种子使用HMR https webpa
  • Angular 4 Subscribe方法多次调用

    我正在创建一个全局模态组件 我的问题是 当我调用 subscribe 方法时 它会根据调用的模态数量多次调用 如何防止对可观察订阅方法的多次调用 请检查下面我的代码 提前致谢 模态 model ts export class Modal t
  • Angular HttpClient - rxjs 映射 - 到类型数组

    我有以下内容HttpClient post调用它返回一个对象数组 import map from rxjs operators map public getArray profileId number Observable
  • 加载 ng2-table 数据表单 API

    我正在学习 Angular 2 我想使用 PHP 中的 API 数据填充 ng2 table 我有一个返回数据的服务 但我不知道如何使用服务的订阅数据填充数据变量 我正在调用服务方法 getLanguages 我的服务代码是 import
  • 如何将 Angular 7 应用程序包含在现有的 html 文件和网站中?

    我一方面有一个现有网站 另一方面有一个 Angular 7 应用程序组件 我想编辑现有的someusecase html并重用我的 Angular 7 应用程序 例如
  • 打字稿错误:setInterval - 类型“Timer”无法分配给类型“number”

    我有以下代码 let onSizeChangeSetInterval setInterval gt 30 当我编译此代码时 出现以下错误 src components popover popover component ts 98 17 中
  • Angular 8 @HostListener('window:scroll', []) 不起作用

    我尝试使用 HostListener 跟踪滚动位置以更改标题的颜色 我的标头组件如下 import Component OnInit Input HostListener Inject from angular core import DO
  • 如何在 Angular 中实现像 Windows 中那样的 IP 地址输入框?

    我想实现一个输入框 以便用户可以输入 IP 地址和端口 端口可以是可选的 我想让它像 Windows 中那样有 3 个点 我尝试过使用 GitHub 上的一些掩码组件 但是当我想输入 IP 时 输入框将如下所示 10 1 40 所以我无法提
  • 如何检测角度7中的url变化包括参数和查询参数

    我需要检测一个组件中路径参数和查询参数的 url 更改 path category key component CollectionPageComponent 最后的网址将是例如类别 T恤 or 类别 T 恤 页 2我需要根据类别获取所有产
  • Angular 2 CLI - 部署

    我使用 Angular 2 CLI 构建了 Angular 2 应用程序 我现在的问题是我想将应用程序部署到本地服务器作为暂存环境以供其他人查看 大多数使用 Angular 2 CLI 的教程都展示了dist该文件夹似乎是在首次使用 CLI
  • 如何将 JSON 对象解析为 TypeScript 对象

    我目前正在尝试将收到的 JSON 对象转换为具有相同属性的 TypeScript 类 但无法使其工作 我究竟做错了什么 员工阶层 export class Employee firstname string lastname string
  • Ionic 3:菜单切换总是被隐藏

    我已经在 Ionic 3 中实现了汉堡菜单 但我遇到了一个问题 当我在 Android 设备上运行该应用程序时 汉堡菜单不断消失 即打开侧面菜单的按钮消失了 然而 这种情况只是偶尔发生 我尝试运行该应用程序 同时使用 Google Chro
  • Angular 2 Final - 以编程方式更改 URL 上的路由参数

    假设我实际上是页面 结果 http server results dateFrom 03 11 2016 page 1 http server results dateFrom 03 11 2016 page 1 我作为结果页面 我想加载页
  • 如何在 RxJS 中“等待”两个可观察值

    在我的应用程序中我有类似的东西 this personService getName id concat this documentService getDocument subscribe response gt console log
  • 使用 Angular 2 中的 TypeScript 关闭引导程序模式

    我有一个按钮 单击该按钮我将打开一个引导模式弹出窗口 模式弹出窗口包含一些带有提交按钮的字段 我只想在保存数据后关闭弹出窗口 我无法使用数据关闭 因为它会在用户点击按钮后立即关闭弹出窗口 有没有办法通过typescript关闭弹出窗口 费用
  • Angular 1 到 Angular 5(导入嵌套组件)

    Before 角度1 5 用户界面路由器 Now 角5 0 如何在像 Angular 1 5 这样的组件父组件中导入子组件 我从 Angular 5 开始制作教程 Heroes 但没有解释这个过渡 所有组件都导入到 app modole t

随机推荐

  • @Autowired beans 在 spring 3.1 中使用 beans:profiles 后未加载

    我用过beans profiles在我的 xml 中是这样的
  • 警告“ScrollingHorizo​​ntally”已定义但从未使用 no-unused-vars

    有人可以帮忙解释这个错误吗 我尝试了几种不同的方法来编写 React Component 是不是少了点什么 Error 4 7 警告 ScrollingHorizo ntally 已定义但从未使用 no unused vars 成分 imp
  • 更新 PHP 中旧存储的 md5 密码以提高安全性

    目前 我有一个存储 md5 密码的数据库 几年前 这被认为比现在更安全 并且已经到了密码需要更安全的地步 我在这里读过很多关于crypt md5 hash bcrypt等 并开始考虑使用以下内容来比现在更好地 保护 密码 我将使用以下组合h
  • Java 中鸭子类型的示例是什么?

    我最近刚刚听说鸭子打字 我读了维基百科文章关于它 但我很难将这些示例翻译成 Java 这确实有助于我的理解 有人能给出 Java 中鸭子类型的清晰示例以及我如何使用它吗 Java 的设计不适合鸭子类型 您可能选择的方式是反思 public
  • 角度找不到上传的图像

    场景很简单 使用表单上传图片 如果上传成功 则刷新图库 我使用 Angular6 和ng 轮播 所有系统均在我的 Windows 10 笔记本电脑中本地设置 表单被上传 文本数据保存在数据库中 图像保存在节点 8 11 1 的文件中 我将图
  • 如何从 MEF 组件提供 XAML 资源

    我有一个导入 MEF 组件 当导入向导打开时会动态加载该组件 一旦用户选择了她想要处理的导入类型 对导入向导对话框的控制就会传递给所选的导入组件 当然 导入组件需要向向导对话框提供资源 例如DataTemplates 目前这是通过以下方式实
  • 当我滚动 UiTableView 时,TextLabel 颜色自动更改

    我改变文本标签颜色didSelectRowAt但是当我滚动时UITableView它也影响到其他方面textlabel also func tableView tableView UITableView didSelectRowAt ind
  • PHP 如何阻止我的网站代理?

    我正在寻找阻止代理进入我的网站的绝对最佳方法 原因是我在项目中使用了唯一的 IP 地址 你会推荐什么 Thanks 不可能完全准确地确定连接到您网站的人是否正在代理其他人的请求 您可以实时合理地做的最好的事情就是寻找X FORWARDED
  • Python Pip 安装版本错误

    我知道这个问题以前曾被问过 但我的问题有点不同 我安装了 pip2 7 并工作 安装了 pip3 4 并工作 使用我的 Python 2 7 和 3 4 版本 但我的 pip2 7 安装在错误的目录中 它安装在 3 4 文件夹中 正如您所看
  • iOS 10 如何设置 UNotificationContent threadIdentifier 进行远程通知

    TL DR 需要在 APNs 通知负载 JSON 中设置什么键来对应threadIdentifier的财产UNNotificationContent目的 例如这 category 键对应于categoryIdentifier财产 iOS 1
  • 使用 libx11 截屏

    我目前正在尝试使用 libx11 截屏 include
  • Ruby 中的 count 方法如何工作?

    我很难理解以下代码段Ruby 文档 a hello world a count lo gt 5 a count lo o gt 2 a count hello l gt 4 a count ej m gt 4 hello world cou
  • 无效的目标版本:推送 Heroku 存储库时为 12

    每当我发生错误时git push heroku master这就是错误 无法在项目后端执行目标 org apache maven plugins maven compiler plugin 3 8 1 compile default com
  • 如何从shopee网站抓取商品?

    我尝试使用 python 来获取产品信息 如名称和价格 但这一次不起作用 即使我通过网络浏览器程序员模式检查html代码来获取类名并尝试使用这个名称来获取我想要的任何东西 但我得到的结果是这样的 我找不到任何项目 class col xs
  • Java 8 中字符串使用多少内存?

    我最近读了很多关于字符串内存分配的文章 但找不到任何与 Java 8 相同的细节 一个String需要多少内存空间 Alexandru Tanasescu 在Java 8中使用 我用的是64位版本 Java7 或更低版本 最小字符串内存使用
  • 在spark-shell中将行拆分为多行

    我已将数据导入到 Spark shell 中的 Spark DataFrame 中 数据填充如下 Col1 Col2 Col3 Col4 A1 11 B2 a b 1 0xFFFFFF A1 12 B1 2 A2 12 B2 0xFFF45
  • Android 使用哪种 HttpURLConnection 实现?

    我正在寻找实际的代码实现connect disconnect in java net URLConnection java java net HttpURLConnection java 在下面的链接中 connect 和disconnec
  • 替换所有地方的字符串,除非它在引号内

    我想全部更换 by D 除非它们在引号内 示例1 Hey man D how re you My friend told me this can t be true 变成 Hey man D how re you D My friend t
  • 需要一个好的正则表达式将 URL 转换为链接,但保留现有链接

    我有大量用户提交的内容 它是 HTML 并且可能包含 URL 其中一些将是 a 已经 如果用户很好 但有时用户很懒 只输入 www something com 或最多http www something com 我找不到合适的正则表达式来捕
  • 如何在剑道日期选择器中将过去的日期显示为禁用日期

    嗨我正在使用Kendo Angular UI 的 Kendo 日期选择器 我使用日期选择器的 min 和 max 属性来限制用户从特定的日期范围中进行选择 但这完全隐藏了超出范围的日期 就像这样 相反 我想将它们显示为禁用状态 就像 2 月