TypeScript - 使用 Angular 下拉刷新

我需要在 Angular 应用上实现下拉刷新功能。我已经尝试过了。但是我无法实现他们提到的工作流程。你能告诉我如何使用这个库吗？

https://www.npmjs.com/package/ngx-pull-to-refresh

我不知道这是怎么运作的？

运行 ng generate component component-name --project ngx-pull-to-refresh 来生成一个新组件

我应该创建一个新的 Angular 项目来尝试，还是在我的项目中就可以做到（我尝试过，但出错了）？看起来我需要在同一个项目中做这个。但到目前为止还没有成功。

注意：别忘了添加 --project ngx-pull-to-refresh，否则它将被添加到 angular.json 文件中的默认项目。

他们也有这个 npm i ngx-pull-to-refresh。但是它没有 </ngx-pull-to-refresh> 组件。

当我使用他们的 npm 并使用该组件时，这个怎么办？

'ngx-pull-to-refresh' is not a known element:
1. If 'ngx-pull-to-refresh' is an Angular component, then verify that it is part of this module.
2. If 'ngx-pull-to-refresh' is a Web Component then add 'CUSTOM_ELEMENTS_SCHEMA' to the '@NgModule.schemas' of this component to suppress this message.

我已经在 app.module.ts 中正确注册，并在 app.component.html 中使用了它

答案＃1

楼主反馈

我这里的问题是 VS Code 添加了错误的 import。它显示的是这个 import { NgxPullToRefreshModule } from 'ngx-pull-to-refresh/lib/ngx-pull-to-refresh.module';。在 ts 文件上没有编译问题。但它无法正常工作。这个模块的自述文件非常令人困惑。

但是你的 stackblitz 显示的是正确的。这个 import { NgxPullToRefreshModule } from 'ngx-pull-to-refresh';

现在它正在工作。

原始

使用 npm i ngx-pull-to-refresh 安装依赖，并将 NgxPullToRefreshModule 添加到你的 app.module。然后按 GitHub 上的说明使用 ngx-pull-to-refresh 元素：https://github.com/YeongCheon/ngx-pull-to-refresh#readme。

<ngx-pull-to-refresh spinnerColor="#ff0000" spinnerSize="100px" (refresh)="myRefreshEvent($event, 'refresh');" (loadMore)="alert('loadmore');">
  <div style="height: 3000px">long content</div>
</ngx-pull-to-refresh>