我该如何让PrimeNG工作呢？
PrimeNG是一个开源的UI组件库，基于Angular框架开发。它提供了丰富的UI组件和功能，可以帮助开发人员快速构建现代化的Web应用程序。
要让PrimeNG工作，你需要按照以下步骤进行操作：
- 安装Angular CLI：PrimeNG是基于Angular开发的，所以首先需要安装Angular CLI。你可以通过运行以下命令来安装Angular CLI：
- 安装Angular CLI：PrimeNG是基于Angular开发的，所以首先需要安装Angular CLI。你可以通过运行以下命令来安装Angular CLI：
- 创建一个新的Angular项目：使用Angular CLI创建一个新的Angular项目。你可以运行以下命令来创建一个名为"my-app"的新项目：
- 创建一个新的Angular项目：使用Angular CLI创建一个新的Angular项目。你可以运行以下命令来创建一个名为"my-app"的新项目：
- 安装PrimeNG：进入到新创建的项目目录中，然后运行以下命令来安装PrimeNG：
- 安装PrimeNG：进入到新创建的项目目录中，然后运行以下命令来安装PrimeNG：
- 导入PrimeNG模块：在你的Angular项目中，你需要导入PrimeNG模块以使用它提供的组件和功能。打开"app.module.ts"文件，并在顶部添加以下导入语句：
- 导入PrimeNG模块：在你的Angular项目中，你需要导入PrimeNG模块以使用它提供的组件和功能。打开"app.module.ts"文件，并在顶部添加以下导入语句：
- 使用PrimeNG组件：现在你可以在你的Angular项目中使用PrimeNG组件了。在你的组件模板文件中，你可以添加PrimeNG组件的标签，并配置它们的属性和事件处理程序。
- 使用PrimeNG组件：现在你可以在你的Angular项目中使用PrimeNG组件了。在你的组件模板文件中，你可以添加PrimeNG组件的标签，并配置它们的属性和事件处理程序。
- 在上面的示例中，我们使用了PrimeNG的Button组件，并为它添加了一个点击事件处理程序。
至此，你已经成功让PrimeNG工作了。你可以根据需要使用PrimeNG提供的其他组件和功能来开发你的应用程序。
推荐的腾讯云相关产品：腾讯云服务器（CVM）、云数据库MySQL版、云存储COS等。你可以通过访问腾讯云官网（https://cloud.tencent.com/）了解更多关于这些产品的详细信息和使用指南。
相关·内容
3回答
简单的问题..。如何调整p-checkbox的大小？在没有primeng的情况下，我做了一些类似<p-checkbox style="transform: scale(2.0)"></p-checkbox>的事情
但是有了primeng我得到了
Error: Cannot find a differ supporting object 'transform: scale(2.0)'
at ...
那么如何让checkbox变大呢？
浏览 0提问于2019-04-16得票数 0
我有一个Angular 6应用程序，安装了最新版本的PrimeNG (6.1.4)，并使用了一个简单的数据表。我想使用nova-light主题，但这不起作用，创建了表结构，但没有主题。我的styles.scss中有以下几行代码：
@import url("~primeicons/primeicons.css");
@import url("~primeng/resources/primeng.min.css");
@import url("~primeng/resources/themes/nova-light/theme.css");
但是:当
浏览 2提问于2018-10-02得票数 0
我是新的Angular 2和primeNG，我正在做的项目是配置了webpack服务器的，现在我想为我的项目使用primeng，我该怎么做呢？
我使用npm安装primeng，并在appmodule中导入primeng模块，然后尝试使用
<p-dropdown [options]="cities" [(ngModel)]="selectedCity"></p-dropdown>
它显示的错误如下
./~/primeng/components/accordion/accordion.js
Module not found: Error: C
浏览 0提问于2017-04-06得票数 1
当被选中一个标签时，我需要在PrimeNG中去掉TabMenu的边框。 ? 我使用的是最新版本或PrimeNG和angular 11。 我该怎么做呢？
浏览 15提问于2021-04-25得票数 0
有人能帮我吗:我正在尝试让PrimeNG与一个用angular-cli创建的Angular应用程序一起工作。我在我的新应用程序中安装了PrimeNG (用命令行界面创建)，但是我不能让样式工作。PrimeNG网站指出，我需要在Index.html中添加以下内容
href="../node_modules/primeng/resources/themes/omega/theme.css"
href="/node_modules/primeng/resources/primeng.min.css"
href="./assets/font-awesome-4.
浏览 1提问于2016-11-17得票数 3
这里有人知道如何让PrimeNG在Webpack的领导下工作吗？
我们在上有项目，但PrimeNG只需要使用System.js加载器
我明白当PrimeNG加载得很好的时候，但是我可以成功地使用PrimeUI库.例如，假设文件primeng/components/togglebutton/togglebutton.ts
错误TS2503:找不到名称空间'PrimeUI‘。
我甚至在中使用...togglebutton.ts声明
declare var PrimeUI:any;
在我的webpack.config里
plugins: [
new webpack.Provid
浏览 4提问于2016-02-29得票数 6
我在angular 2中使用了primefaces中的primeNg模块来创建时间选择器。我得到了它的工作，但它是显示与损坏的设计。为了让设计正确，还有什么需要补充的吗？我使用的代码：
包版本：
"primeng": "^1.0.0-beta.7",
"primeui": "^4.1.10"
Module.ts：
import { CalendarModule } from 'primeng/primeng';
imports: [CalendarModule]
Html：
<p-calendar [(ng
浏览 3提问于2017-06-14得票数 0
回答已采纳
你知道，我花了更多的时间，只想让事情变得更有角度，而不是真正用角度来发展。一定有更简单的方法..。:(
目前，我正在使用aspnetcore-spa模板，创建一个带有命令"dotnet新角“的项目--这是版本1.0.3，它将角4.1.2添加到npm依赖项中。这对项目的快速运行很有帮助。但是现在我想添加PrimeNG来利用它们的表单控件。我一整天都在为这件事而奋斗，如果有人能提供一些帮助，我会很高兴的。
以下是我在当前的努力中所做的工作(最近的一次，每次都要重新开始)：
1)添加到package.json文件中："primeng"："4.1.0-rc.2“
2)将
浏览 0提问于2017-06-19得票数 1
使用Angular 6和Primeng应用程序。在整个应用程序中使用原生组件p-spinner。该组件生成一个本机组件<input type="text"和两个带有样式类ui-spinner-button的按钮。 我想通过设置tabIndex=-1跳过这两个生成的按钮上的制表符。 我该怎么做呢？ 使用Angular 6和Primeng 6.x
浏览 13提问于2019-03-21得票数 0
3回答
我正试图让primeng在我的angular2项目中工作，但还没有让它发挥作用。
采取的步骤：
安装：npm install primeng --save
添加到模块import {DialogModule} from 'primeng/primeng'; @NgModule({... imports: [DialogModule, ...]});中
向index.html添加样式表
添加到模板中：<p-dialog header="Test" [(visible)]="display"> Content </p
浏览 2提问于2016-12-08得票数 0
回答已采纳
我安装了primeng，并得到了一个对等依赖警告：
>npm install primeng --save
npm WARN primeng@9.0.2 requires a peer of zone.js@^0.10.2 but none is installed. You must install peer dependencies yourself.
所以我尽职尽责地安装了zone.js@^0.10.2 ...
>npm install zone.js@^0.10.2 --save
npm WARN @angular/core@8.0.0 requires a peer of
浏览 1提问于2020-03-20得票数 1
我想以图标的形式表示数据表primeng中列字段的布尔值。下面是一段代码：
<p-dataTable [value]="ARRAY_METADATA" rowHover="true">
<p-column field="id" header="Field ID" [sortable]="true"></p-column>
<p-column field="booleanField" header="Boolean Field"
浏览 6提问于2017-07-10得票数 1
我在我的angular应用程序中使用Primeng Tabview。我有如下所示的代码来使用代码设置活动选项卡。
<button (click)="change(0)">First</button>
<button (click)="change(1)">Second</button>
<button (click)="change(2)">Third</button>
<p:tabView [activeIndex]="index" ...
pu
浏览 4提问于2018-03-17得票数 5
我刚刚开始了一个新的安圭拉项目。我一直在尝试使用角中的共享模块导入，然后将primeng模块导出到app.module.ts和使用者站点。Primeng是在app.module.ts中声明的组件中工作的，而不是我创建的consumer site.module.ts组件。我不知道为什么它在一种而另一种不起作用。
shared.module.ts
import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import { BrowserModul
浏览 7提问于2022-07-02得票数 -1
回答已采纳
在PrimeNG 9中，我可以将投影到按钮中的内容居中对齐。有人知道如何在PrimeNG 10中实现这一点吗？ <div class="ui-g ui-fluid" >
<div class="ui-g-12">
<button pButton>
<div>Content</div>
<i class="fa fa-home"></i>
</button>
</div>
</div&g
浏览 34提问于2020-11-04得票数 2
1回答
所以我开始使用PrimeNG，我跟踪网站，网站上写着为了让它正常工作应该做的每一件事。我跟踪了网站上的一切，但是我的UI看起来有点奇怪，就像下面的图片一样，有人知道为什么会发生这种情况吗？
重要代码部分：
TS
import {CalendarModule} from 'primeng/primeng';
imports: [
BrowserModule,
FormsModule,
HttpModule,
routing,
CalendarModule],
<p-calendar [(ngModel)]="startDate" [showIcon]=&
浏览 2提问于2016-11-01得票数 3
回答已采纳
我正在为Angular2使用一个非常优秀的小部件库，名为PrimeNg。
假设PrimeNg缺少了我所需要的一些功能，所以我会对回购进行分叉，并提交一个以使我的更改进入主回购。当我等待拉请求被接受时，我想在我的package.json中包括我的回购叉。
我尝试从以下内容更新我的package.json：
"dependencies": {
...
"primeng": "1.0.0-beta.13",
...
}
对此：
"dependencies": {
...
"primeng&
浏览 2提问于2016-08-30得票数 5
我在我的角度应用中使用了primeng。我想向其中一个组件添加一些功能，所以我遵循了指令()，并完成了所有的更改。现在，我想打包它，以便在我的应用程序中安装这个修改过的分支。我该怎么做呢？
我以前通过运行'npm‘并在我的应用程序中安装生成的tar包来引导NG2。我试着用primeng做同样的事情，但是我的项目出错了，因为primeng.js文件不存在。我想我需要用一种不同的方式去做，但是我不知道怎么做，我也没有太多的webpack/吞咽的经验。
浏览 6提问于2016-12-24得票数 4
回答已采纳
请建议PrimeNG版本-9是否只与Angular 9常春藤编译器兼容？我将我的项目从Angular 7升级到了9，PrimeNG 7.1.3 .I尝试了ng serve，它工作得很好，但是ng-build --prod抛出了错误，如下所示(只提供了一个例子，但几乎所有的PrimeNG模块都有相同的错误)。请告知使用ngcc的完整命令是什么，或者只有安装PrimeNG-9才是解决方案？ 错误： node_modules/primeng/components/scrollpanel/scrollpanel.d.ts:34:22 - error NG6002:出现在MetricsModule的N
浏览 24提问于2020-06-30得票数 1
回答已采纳
4回答
如何更改primeNG (传奇-蓝色主题)的默认主颜色？更改-主颜色没有帮助，因为在节点_模块/./teme.css中，元素的样式是使用主色十六进制而不是‘-主颜色’。我也不能覆盖所有使用原色的元素的样式，因为它们太多了，它们有不同的颜色--在悬停和焦点上有不同的颜色，我该如何处理呢？
浏览 7提问于2021-02-14得票数 4
回答已采纳
如何从PrimeNG表连接列切换和选择复选框？链接到PrimeNG表格：
我有这样的表，这两个东西不能一起正常工作：
浏览 0提问于2018-08-20得票数 0
对primeng datatable网格的行选择设置样式的最佳方式是什么？我有一个复选框，当选中时，行将变为引导蓝色。我想要使所选行的颜色变亮。
我该怎么做呢？
浏览 8提问于2017-03-02得票数 1
1回答
我试图在我的角4应用程序中实现PrimeNG日历中的日期时间针刺器。我做了下面的安装。
>npm install primeng --save
module.ts
import { Calendar } from 'primeng/primeng'
component.ts
import { Calendar } from 'primeng/primeng'
Component.html
当我运行网站时，我会得到以下错误。
模板传递错误：“P-日历”不是已知的元素: 1.如果“p-日历”是一个角分量，则验证它是该模块的一部分。2.如果“p-日历”是web
浏览 1提问于2018-03-24得票数 0
2回答
我正在开发一个angular应用程序。在这里，我使用primeng表行扩展功能。代码示例如下：
在这个primeng中使用了自己的图标进行行扩展，其代码如下：
<button type="button" pButton pRipple [pRowToggler]="product" class="p-button-text p-button-rounded p-button-plain" [icon]="expanded ? 'pi pi-chevron-down' : 'pi pi-chevron-rig
浏览 5提问于2021-11-22得票数 0
我在angular.json样式数组中包含了一些样式，如下所示：
"styles": [
"src/styles.css",
"node_modules/primeicons/primeicons.css",
"node_modules/primeng/resources/themes/omega/theme.css",
"node_modules/primeng/resources/themes/bootst
浏览 1提问于2018-08-24得票数 9
我正在尝试构建一个带有自定义Webpack配置的角库，其中我指定了externals设置，以从编译输出中排除某些依赖项。一切正常，所有的外部都被排除在外.除了PrimeNG！
注意:我使用的是角8和自定义构建器ngx-build-plus:browser，而不是ng-packagr，但我想在这种情况下它是不相关的。我对它进行了配置，以便它正确地构建库。而且确实如此，除了上述的问题。
我使用以下命令运行构建：ng build --extra-webpack-config libs/web-templates/extra-webpack.config.js --project web-templa
浏览 5提问于2020-02-08得票数 0
1回答
角PrimeNG倍频可见假不起作用。
<p-megaMenu [model]="menuItems"></p-megaMenu>
this.menuItems = [
{
label: 'Home', items: null, routerLink: ['']
},
{
label: 'About', visible: false,
浏览 2提问于2018-03-22得票数 1
primeng的命令有一个名为MenuItem的参数，该参数是单击其项时要执行的函数。中提供了一个用于向用户提供反馈的示例。
command: (event: any) => {
this.activeIndex = 0;
this.msgs.length = 0;
this.msgs.push({severity:'info', summary:'First Step', detail: event.item.label});
}
但是
浏览 2提问于2017-11-30得票数 7
我正在尝试使用react-i18next让I18N正常工作。我正在尽可能接近地遵循提供的步骤。我已经尝试了几个小时，到处搜索，但还没有发现我做错了什么。任何帮助都是非常感谢的。
我正在获取这个错误堆栈跟踪：
Exception has occurred: Error
Error: I18nextWithTranslation suspended while rendering, but no fallback UI was specified.
Add a <Suspense fallback=...> component higher in the tree to pr
浏览 2提问于2019-03-02得票数 20
我想使用primeng的megamenu组件，但无法让它工作，每次我加载项目时，当它显示菜单时，它只显示第一个图标，没有文本，也没有其他任何内容，直到我传递菜单空间，让它只显示第一行和控制台时，我总是看到相同的错误：
错误(ng:///MegaMenuModule/MegaMenu.ngfactory.js:184)错误:找不到“对象”类型不同的支持对象“对象”。NgFor只支持绑定到诸如数组之类的Iterable。
megamenu组件依赖于un，它包含菜单的定义：
我在找docs文档
(还有很多其他的)，最后，我推断出错误与角度错误有关，以
浏览 2提问于2017-11-07得票数 2
回答已采纳
有没有人拿到了PrimeNG日程表，可以在《webpack角度2》应用上工作呢？像 oak一样，我不能让它工作，不像他，我仍然不能。
在我的vendor.ts中，我加载了所需的库：
require('script!../node_modules/jquery/dist/jquery.js');
require('script!../node_modules/moment/moment.js');
require('script!../node_modules/fullcalendar/dist/fullcalendar.js');
在我的组件中，
浏览 0提问于2016-06-14得票数 5
我有一个下拉列表，其中包含在特定条件下从angular函数动态加载的100+元素。 此加载需要几秒钟。没有挂起的http调用，该时间由priming组件(dropdown)用于delete和create元素(选项)。 我会尝试使用primeng v7中的新功能virtualScroll。 我的项目有angular 4.x和primeng v6。我还没有找到primeng 7的基本要求。我试图升级到项目7，但项目仍然失败。 是否有从primeng 6迁移到primeng 7的文档？或者有没有可能在primeng 6中使用virtualscroll？
浏览 22提问于2019-07-03得票数 0
3回答
我会将PrimeNG面板菜单集成到我的应用程序中。
在modules.ts中，我导入PanelMenuModule和MenuModule
import {LeftMenuComponent } from './left-menu/left-menu.component';
import {PanelMenuModule} from 'primeng/panelmenu';
import {MenuModule} from 'primeng/primeng';
@NgModule({
imports: [
CommonModule,
浏览 0提问于2018-03-23得票数 0
回答已采纳
我刚刚更新了我的项目到Angular 9，我也更新了PrimeNG到9.1.2。现在我的 import {GrowlModule} from 'primeng/primeng'; 不起作用，它就会说该目录中没有GrowlModule。我知道在版本9中，一些导入发生了变化，所以我也尝试了primeng/api，但它也不存在。谁能告诉我在哪里可以找到这个模块？
浏览 22提问于2020-07-03得票数 4
回答已采纳
我正在使用PrimeNG-组件pInputText和p-dropdown，我希望彼此对齐。我有以下代码：
<div class="main-div">
<div class="block-div">
<h4 class="input-description">Enter Information:</h4>
<span class="ui-float-label">
<input id="psp-input" type="t
浏览 0提问于2018-12-24得票数 0
回答已采纳
我正在移植一个角4应用程序到9，并且还必须升级我们的一些第三方控件。
在PrimeNg的4.3中，我们以以下方式使用了DataTable：
import { DataTable, FilterMetadata, LazyLoadEvent } from 'primeng/primeng';
export abstract class GridFiltersBase {
@ViewChild('modal') submittingModal: ActionSubmissionModal;
@ViewChild(DataTable) public
浏览 3提问于2020-03-03得票数 0
1回答
我有一个angular应用程序，我已经通过npm install添加了primeng npm。正如primeng的资源页面中所述，该库附带了32个免费主题，但在node_modules/primeng/ GetStarted中，我只看到了8个主题，没有一个与材料设计相关(例如primeng/resources/themes/md-light-indigo/theme.css).我似乎找不到访问这个主题的方法。我想导入primeng/resources/themes/md-light-indigo/theme.css主题，但如前所述，我似乎在node_modules/primeng/resou
浏览 11提问于2020-08-19得票数 0
回答已采纳
我有个很蠢的问题。我已经创建了一个自定义的PrimeNG组件，它看起来工作得很好，但是有两个问题：
--即使我和其他PrimeNG组件一样使用ViewEncapsulation.None，已经使用/存在的PrimeNG CSS类(例如PrimeNG主题文件中的p-datepicker样式)也不适用于我的组件。显然，如果我将相应的样式复制到我的coponent的scss文件中，它们就可以很好地工作，
我完全不知道谁/何时/如何将CSS类的名称从'p-‘重命名为'ui-’。问题是我的自定义PrimeNG组件没有重新命名，它们仍然以'p-‘作为前缀，因此显然组件的样式不正确。
浏览 0提问于2020-08-29得票数 1
我在浏览器中遇到错误
GET http://localhost:3000/multiselect.css 404 (Not Found)
Failed to load multiselect.css
当我试图在组件模块文件中导入MultiSelectModule时：
import { MultiSelectModule } from 'primeng/multiselect';
@NgModule({
...
imports: [CommonModule, FormsModule, MultiSelectModule],
...
我已经在app.modules.ts中导
浏览 6提问于2021-11-10得票数 0
我通过npm install primeng --save安装了primeng
在package.json中，在依赖项和devDepencencies中，primeng位于^12.0.1
在angular.json中，我加入了相关的样式。
"styles": [
"node_modules/primeng/resources/themes/saga-blue/theme.css",
"node_modules/primeng/resources/primeng.min.css",
"node_modules/primeicon
浏览 4提问于2021-08-10得票数 0
我能够在我的angular 2应用程序中正确设置primeng。我正在使用这个控件，但是我不知道在这个代码中的url中放什么：
<p-fileUpload name="myfile[]" url="http://localhost:3000/upload" multiple="multiple" accept="image/*" maxFileSize="1000000"></p-fileUpload>
我使用的是firebase存储，但我不知道它的url是什么。有没有人能帮我或者只是给我指
浏览 1提问于2017-02-02得票数 1
我用webpack让带有PrimeNG的Angular2运行。PrimeNG依赖于本身使用主题的PrimeUI，其中一个主题(主题较暗)缺少一个图像(它只适用于旧浏览器)。
但是现在，当我使用webpack加载css文件时，它告诉我“找不到模块:错误:无法解析' file‘或'directory’...
如何从外部控制css加载器或sass加载器(不确定最后由谁处理)应该忽略它？
谢谢!
浏览 4提问于2016-03-17得票数 1
我们一直试图将PrimeNG组件集成到JHipster (Range4)生成的项目中，但没有成功。在下载并将PrimeNG安装到我们的项目之后，我们可以导入类，但是当我们将相应的标记包含到模板中时，什么都不会被绘制出来。我们已经测试了几个PrimeNG组件。此外，我们在app.module中完成了导入，等等。我希望更具体一些，但是在任何地方都不会显示错误。您对如何与PrimeNG和JHipster一起工作有任何提示吗？谢谢
浏览 7提问于2017-05-24得票数 13
回答已采纳
1回答
我有一个angular 5应用程序，我正在使用primeng上传工具。上传的post接口需要三个参数: file (文件)，id (string)，fileType (string)。我可以做后两个，但是文件类型我就是不明白。后两个是字符串，明白了，但是我该如何寻址文件部分呢？
这是我的json帖子：
[{ "file" : <<DATA>>, "id": "1234123", "fileType": "doc" }]
我应该为文件类型添加什么内容以及如何添加内容？
浏览 5提问于2017-11-17得票数 0
我使用primeng p-日历，它可以在谷歌-铬，但它不能工作(日期选择器，不打开文本框点击)在任何其他浏览器。
下面是我使用的html代码：
<p-calendar [(ngModel)]="startDate" showIcon="true" monthNavigator="true" yearNavigator="true" dateFormat="dd/mm/yy" dataType="yearRange="1970:2030"></p-calendar>
下
浏览 1提问于2017-09-24得票数 0
回答已采纳
如何为某些样式设置优先加载。现在，从我可以看到的样式是异步加载的，这让我头疼，当涉及到样式时，整个应用程序。我只想在最后加载我的gridStyle.css和style.css。
"styles": [
"styles.css",
"../node_modules/primeng/resources/themes/omega/theme.css",
"../node_modules/primeng/resources/primeng.min.css",
"..
浏览 17提问于2017-01-20得票数 1
回答已采纳
我正在使用，并试图在其中包括，但我很难添加它。
下面是我在模板中所做的包括PrimeNG的更改
./src/vendor.browser.ts:
// Prime faces: http://www.primefaces.org/primeng/#/setup
import 'primeng/primeng';
./src/app/app.module.ts:
import { ToggleButtonModule } from 'primeng/primeng';
@NgModule({
bootstrap: [App],
declarations:
浏览 3提问于2017-02-16得票数 2
我正试图将PrimeNG加载到Webpack捆绑的Angular2应用程序中。
首先，我安装了npm：
npm install primeng --save
npm install primeui --save
这在我的package.json中增加了以下两行：
+ "primeng": "^1.0.0-beta.8",
+ "primeui": "^4.1.12",
接下来，如angular2-webpack入门版中的所示，我向venders.ts添加了一个导入。
import 'script!primeui
浏览 7提问于2016-06-13得票数 3
回答已采纳
我终于能让primeNG用角-cli工作了。在“.角-cli.json”中，我有：
"styles": [
"../node_modules/primeng/resources/themes/omega/theme.css",
"../node_modules/primeng/resources/primeng.css",
"styles.css"
],
我试图像这样使用CalendarModule：
import {CalendarModule} from
浏览 4提问于2017-04-28得票数 1
回答已采纳
我想对前端使用angular2框架，所以对于UI部分，我想使用primeng，但我不知道npm是如何工作的。
技术信息：
我的IDE是eclipse/netbeans
项目将部署在Wildfly8.0上
我可以将JSF组件与primeng混合吗？
浏览 3提问于2016-06-23得票数 3
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
实时音视频
对象存储
云直播活动推荐
腾讯云开发者
