使用打底的Angular 2 typescript上的日历

所以我开始使用Priming，我跟随网站，网站上说了为了让它工作应该做的一切。我在网站上一针见血，但我的UI看起来有点奇怪，就像下面的图片一样，有人知道为什么会这样吗

重要代码部分：

TS

import {CalendarModule} from 'primeng/primeng';

imports: [
BrowserModule,
FormsModule,
HttpModule,
routing,
CalendarModule],

HTML

<p-calendar [(ngModel)]="startDate" [showIcon]="true" name="startDate"></p-calendar> <span style="margin-left:35px"></span>

另外，顺便问一下，有人知道如何使用网站呈现的主题之一吗？我试图找到免费的代码，但找不到。谢谢你的帮助

日历用户界面图像：

退房。PrimeNG团队经常使用他们最新的快照作为他们的在线文档，而实际版本可能仍有点落后

JavaScript库依赖项 。从Priming 1.0.0-beta.19开始，这可能会起作用。在此之前，您必须添加一系列依赖项：

<!-- Datetimepicker, Slider, Schedule -->
<script src="https://code.jquery.com/jquery-2.2.4.min.js"></script>
<script src="https://code.jquery.com/ui/1.11.4/jquery-ui.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-ui-timepicker-addon/1.6.1/jquery-ui-timepicker-addon.min.js"></script>

或：

CSS依赖项 还要确保正确设置了所有相关的CSS依赖项。的相应页面列出了要包括的以下文件：

<link rel="stylesheet" type="text/css" href="/node_modules/primeng/resources/themes/omega/theme.css" />
<link rel="stylesheet" type="text/css" href="/node_modules/primeng/resources/primeng.min.css" />
<link rel="stylesheet" type="text/css" href="YOUR_PATH/font-awesome.min.css" />

感谢您的帮助；然而，我尝试了两种方法，问题仍然是一样的。它的工作原理是这样的，但它显示的用户界面与网站显示的用户界面相差甚远。你确定所有必要的css文件都可用吗？我对前端部分有点陌生，所以我不确定我是否这样做了。我以为在我安装primeng和primeui的那一刻，primefaces的css已经包含在内了，还有什么需要做的吗？我遵循了第一篇文章中提到的教程。PrimeNG文档中的安装说明列出了所有相关的css依赖项，我已经更新了我的答案以反映这些附加信息。哦，谢谢。我已经在“styleUrls:['./task report.component.css'、“../../../../node\u modules/primeng/resources/primeng.min.css'、“../../../node\u modules/primeui/themes/omega/theme.css'”上做了这项工作。我尝试使用primeui而不是primeng来查看它是否有效，但仍然没有。我想我会尝试另一种使用datepicker的方法，但非常感谢您的帮助。

<link rel="stylesheet" type="text/css" href="/node_modules/primeng/resources/themes/omega/theme.css" />
<link rel="stylesheet" type="text/css" href="/node_modules/primeng/resources/primeng.min.css" />
<link rel="stylesheet" type="text/css" href="YOUR_PATH/font-awesome.min.css" />