Question

我尝试使用以下库向我的Angular应用程序添加样式滚动条： https://github.com/zefoy/ngx-perfect-scrollbar

我按照该链接中的文档并将导入添加到我的app.module.ts文件中，但在尝试使用它时仍然遇到错误。

我也尝试将PerfectScrollbarModule和PerfectScrollbarConfigInterface导入到我使用它的组件中，但仍然没有运气。

我尝试了以下所有HTML，但是它们导致了相应的错误消息。我错过了什么？顺便说一句，我是关于最新版本的Angular。

<perfect-scrollbar class="container" [config]="config">
  <div class="content">Scrollable content</div>
</perfect-scrollbar>

无法绑定到＆＃39; config＆＃39;因为它不是一个已知的属性＆＃39;完美-滚动＆＃39;

<perfect-scrollbar class="container">
  <div class="content">Scrollable content</div>
</perfect-scrollbar>

＆＃39;完美-滚动＆＃39;不是一个已知元素：

<div [perfect-scrollbar]="config">
    ...
</div

无法绑定到完美滚动条＆＃39;因为它不是一个已知的属性＆＃39; DIV＆＃39;

更新：

我在地图对象中添加了ngx-perfect-scrollbar': 'npm:ngx-perfect-scrollbar'是我的systemjs文件，以及以下的包对象：

'ngx-perfect-scrollbar': {
    main: 'bundles/ngx-perfect-scrollbar.umd.js',
    defaultExtension: 'js'
  }

以下是 app.module.ts 文件的相关部分：

import { PerfectScrollbarModule }          from 'ngx-perfect-scrollbar';
import { PerfectScrollbarConfigInterface } from 'ngx-perfect-scrollbar';

export const PERFECT_SCROLLBAR_CONFIG: PerfectScrollbarConfigInterface = {
  suppressScrollX: true
};

@NgModule({ 
    imports: [        
        ...
        PerfectScrollbarModule.forRoot(PERFECT_SCROLLBAR_CONFIG)
    ],
    ...
})

Answer 1

如果要使用完美滚动条的组件依赖于app.module之外的其他模块（例如header.module ...），则还应在此子模块中导入PerfectScrollbarModule。您可以使用与app.module中完全相同的方式执行此操作。

Answer 2

首先，你是否正确安装了它？我是说你运行这个命令了吗？ npm install ngx-perfect-scrollbar --save-dev，如果不是，那么你应该先做，以便能够使用该库。

完美的滚动条不适用于Angular

2 个答案: