Twitter bootstrap 引导日期时间选择器不显示控件图标

开发MVC应用程序，我在Razor中导入了这些脚本：

<link rel="stylesheet" href="@Url.Content("~/Content/bootstrap.min.css")">
<link rel="stylesheet" href="@Url.Content("~/Content/bootstrap-datetimepicker.min.css")">
<link rel="stylesheet" href="@Url.Content("~/Content/_bootstrap-datetimepicker.less")">
<script src="@Url.Content("~/Scripts/jquery-3.3.1.min.js")"></script>
<script src="@Url.Content("~/Scripts/bootstrap.min.js")"></script>
<script src="@Url.Content("~/Scripts/popper.min.js")"></script>
<script src="@Url.Content("~/Scripts/moment-with-locales.min.js")"></script>
<script src="@Url.Content("~/Scripts/bootstrap-datetimepicker.min.js")"></script>

我的datetimepicker和timepicker都显示了箭头按钮，如图所示：

---

两者都有控制元素，但没有图标，我无法找到原因。

所以问题在于通过Nuget软件包导入MVC引导。加载引导图标文件时出现问题

因此，您需要像下面这样从bootstrapcdn导入它：

$('#datetimepicker').datetimepicker({
    locale: 'cs',
    format: 'DD.MM.YYYY',
    dayViewHeaderFormat: 'MMMM YYYY',
    minDate: today,
    stepping: 1,
    showTodayButton: true,
    allowInputToggle: true
});
$('.timepicker').datetimepicker({
    locale: 'cs',
    format: 'HH:mm',
    dayViewHeaderFormat: 'MMMM YYYY',
    stepping: 5,
    allowInputToggle: true
});

<link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap-glyphicons.css">

---

或者从您的项目中下载并加载它。

在bootstrap 4中，我将这些图标替换为字体图标以使其正常工作：

 $(".timepicker").datetimepicker({
        icons:
            {
                up: 'fa fa-angle-up',
                down: 'fa fa-angle-down'
            },
        format: 'LT'
    });

---

引导不支持图标。 您需要为它提供一个单独的图标库

<link href="~/Content/font-awesome.min.css" rel="stylesheet" />
<link href="~/Content/bootstrap-datetimepicker.min.css" rel="stylesheet" />

$('.datepicker').datetimepicker({
    format: 'DD/MM/YYYY HH:mm', 
    useCurrent: false,
    showTodayButton: true,
    showClear: true,
    toolbarPlacement: 'bottom',
    sideBySide: true,
    icons: {
        time: "fa fa-clock-o",
        date: "fa fa-calendar",
        up: "fa fa-arrow-up",
        down: "fa fa-arrow-down",
        previous: "fa fa-chevron-left",
        next: "fa fa-chevron-right",
        today: "fa fa-clock-o",
        clear: "fa fa-trash-o"
    }
});

$（'.datepicker'）.datetimepicker({
格式：“DD/MM/YYYY HH:MM”，
useCurrent:false，
ShowToday按钮：正确，
真的,，
工具栏位置：“底部”，
是的，
图标：{
时间：“fa-fa-clock-o”，
日期：“日历”，
向上：“法-法-箭头向上”，
向下：“法-法-箭头向下”，
上一篇：“左前额V字形”，
下一步：“右前额V字形”，
今天：“fa-fa-clock-o”，
清除：“fa-fa-trash-o”
}
});

我找到了这个答案，它对我起了作用。人们可能需要将“fa-fa-clock-o”改为“fa-fa-clock”