3

所以我开始使用 PrimeNG，并且我一直在关注网站文档，其中说明了为了使其正常工作应该做的一切。我按照网站上的所有内容进行了操作，但是我的 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>

另外，顺便说一句，有没有人知道如何使用网站提供的主题之一？我试图找到免费代码的代码，但找不到。谢谢你的帮助。

日历用户界面图像：

日历

4

1 回答 1

1

查看此 SO 帖子中接受的答案。PrimeNG 团队经常使用他们最新的快照作为他们的在线文档，而实际发布可能仍然有点落后。

JavaScript 库依赖项

他们目前正在将日历组件重新实现为纯原生的。从 PrimeNG 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>

或者：

<script src="node_modules/primeui/primeui-ng-all.min.js"></script>

CSS 依赖项

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

<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" />
于 2016-11-01T21:58:07.757 回答