代码之家 › 专栏 › 技术社区 › Rüdiger

尝试在应用程序中使用Priming中的p下拉列表时出错

primeng-dropdowns primeng angular

Rüdiger · 技术社区 · 6 年前

this PrimeNG-Dropdown 在我的申请中。所以我所做的是:

npm i primeng --save

DropdownModule 在我的进口 app.module.ts

<p-dropdown [options]="optionList" [(ngModel)]="selectionString" placeholder="Choose one"></p-dropdown>

跑步时 ng serve 和开始 localhost:4200

./node_modules/priming/components/multiselect/multiselect.js模块未找到:错误:无法在中解析“@angular/cdk/scrolling” “%projectroot%\node\u modules\primeng\components\multiselect”

我还尝试从中删除导入 imports

删除导入时,出现以下错误:

Can't bind to 'options' since it isn't a known property of 'p-dropdown'.
1. If 'p-dropdown' is an Angular component and it has 'options' input, then verify that it is part of this module.
2. If 'p-dropdown' is a Web Component then add 'CUSTOM_ELEMENTS_SCHEMA' to the '@NgModule.schemas' of this component to suppress this message.
3. To allow any property add 'NO_ERRORS_SCHEMA' to the '@NgModule.schemas' of this component. ("
      <p-dropdown [ERROR ->][options]="optionList" [(ngModel)]="selectionString" placeholder="Choose one"></p-dropdown"): ng:///AppModule/ProjectGeneratorComponent.html@13:18
'p-dropdown' is not a known element:
1. If 'p-dropdown' is an Angular component, then verify that it is part of this module.
2. If 'p-dropdown' is a Web Component then add 'CUSTOM_ELEMENTS_SCHEMA' to the '@NgModule.schemas' of this component to suppress this message. ("
      [ERROR ->]<p-dropdown [options]="optionList" [(ngModel)]="selectionString" placeholder="Choose one">"):

3 回复 | 直到 6 年前

Parth Savadiya 6 年前

您需要安装Angular CDK。使用 npm安装@angular/cdk——保存 指挥部。

import {MultiSelectModule} from 'primeng/multiselect';

Seyed-Amir-Mehrizi 6 年前

    npm install primeng --save   //install prime in your machine

    npm install primeicons --save    //install prime icon in your machine

接下来:您应该转到项目中的angular.json文件,并在样式部分复制这些行。这些行实际上是node_模块文件夹中库的路径。但在本章中真正重要的是,你使用的是哪个版本的angular。如果使用的是angular version 4且小于该版本,则应将以下路径复制到“样式”章节:

"../node_modules/primeicons/primeicons.css",
"../node_modules/primeng/resources/themes/nova-light/theme.css",
"../node_modules/primeng/resources/primeng.min.css",

但如果您使用的版本超过4,则意味着5、6或7,您应复制以下路径:

  "./node_modules/primeicons/primeicons.css",
  "./node_modules/primeng/resources/themes/nova-light/theme.css",
  "./node_modules/primeng/resources/primeng.min.css",

然后,您可以直接在app.module中导入primes模块,并使用html标记呈现组件。但请注意,有些组件需要动画,您应该通过npm将动画安装到您的机器上。

     npm install @angular/animations --save

并在应用程序模块中导入模块:

 import {BrowserAnimationsModule} from '@angular/platform-browser/animations';

我希望它能帮助你。

Héctor Cervera Panella 6 年前

在appmodule.ts中尝试:

import {CUSTOM_ELEMENTS_SCHEMA} from "@angular/core";

@NgModule({
  ...
  bootstrap: [AppComponent],
  schemas: [CUSTOM_ELEMENTS_SCHEMA]
})

user14659427 3 年前

将FormsModule导入到导入DropdownModule的模块中。我也遇到了同样的问题,我就是这样解决的。