Question

我尝试将PrimeNg设置到我的Angular-CLI项目中。所以我遵循了诸如

的步骤 npm install primeng --save npm install primeui --save

我需要一个下拉列表，因此我在我的main module.ts文件中添加了
{import { DropdownModule } from 'primeng/primeng';，后跟imports:[DropdownModule]。

然后将样式添加到.angular-cli.json文件中，如

"../node_modules/primeng/resources/themes/omega/theme.scss", "../node_modules/primeng/resources/primeng.min.scss"。

我使用 .SCSS 文件进行样式设置。我已将下拉列入我的html

<p-dropdown [options]="cities1" [(ngModel)]="selectedCity1"></p-dropdown>

我的问题是样式没有反映到页面中，当我点击下拉列表时显示以下错误。

错误类型错误：无法读取属性＆＃39;样式＆＃39;未定义的

Answer 1

1 - 首先使用sass创建一个项目，使用sass（或使用css-setup时调整现有的项目），并使用以下命令：

 - ng new project --style=scss

2 - 获取所需的软件包以使用PrimeNg

 - npm install primeng –-save
 - npm install font-awesome --save

3-通过导入所需的css和scss来调整 styles.scss

 -  @import 
    "../node_modules/font-awesome/css/font-awesome.min.css", //is used by the style of ngprime
    "../node_modules/primeng/resources/primeng.min.css", // this is needed for the structural css
    "../node_modules/primeng/resources/themes/omega/theme.scss", // this is the scss file of one of the 16 free styles of ngprime.

4 - 您可以在＆＃39; ../ node_modules / primeng / resources / themes / omega / theme.scss＆＃39;中调整scss变量。如果需要的话。下拉列表将相应调整。

Here you can find a the style of the dropdown

PrimeNg无法使用.scss文件

1 个答案: