小编adr*_*ons的帖子

使用 cdk-virtual-scroll (Angular 8) 滚动到底部

目标

显示消息列表并在收到新消息时滚动到底部,即使我在顶部。即使使用不同高度的元素,我也想完全滚动到底部。

问题

使用虚拟滚动,我必须设置[itemSize]属性,但对我来说它不是静态值:

  • 当一条消息对于一行来说太长时,它会分成多个,因此它的高度会发生变化。
  • 我有不同类型的不同高度的消息(例如系统消息)。

此外,我正在使用ng-content从父级插入一个按钮来加载以前的消息。我看到的是,当_scrollToBottom被调用时,它并没有将我带到底部,而是将我带到更高一点。我怀疑这是因为虚拟滚动中元素的高度不同。

我已经从 Angular 阅读了这个自动调整滚动策略问题:https : //github.com/angular/components/issues/10113;但我不确定这会解决我的问题。

欢迎任何我能做什么的想法。

测试

代码沙盒https : //codesandbox.io/s/angular-virtual-scroll-biwn6

  • 加载消息后,向上滚动。
  • 发信息。(加载新消息时,不是滚动到底部,而是虚拟滚动停止高一点)
  • 重复

错误视频:https : //gofile.io/d/8NG9HD


解决方案

Gourav Garg给出的解决方案有效。只需执行两次滚动功能即可。

我现在这样做:


  private _scrollToBottom() {
    setTimeout(() => {
      this.virtualScrollViewport.scrollTo({
        bottom: 0,
        behavior: 'auto',
      });
    }, 0);
    setTimeout(() => {
      this.virtualScrollViewport.scrollTo({
        bottom: 0,
        behavior: 'auto',
      });
    }, 50);
  }
Run Code Online (Sandbox Code Playgroud)

我认为它不是很优雅,但工作正常。

javascript angular-material angular virtualscroll angular-cdk-virtual-scroll

7
推荐指数
1
解决办法
3310
查看次数

Angular 库捆绑本地依赖

我有两个库:核心库和客户端库。

\n

核心是私有的,而客户端是要发布的。我想将核心包含在客户端捆绑包中(客户端使用核心功能),因此最终用户不需要管理核心依赖项。

\n

\xc2\xbf我该怎么做?任何帮助,将不胜感激。

\n

\n
packages\n\xe2\x94\x9c\xe2\x94\x80\xe2\x94\x80 client\n\xe2\x94\x82   \xe2\x94\x9c\xe2\x94\x80\xe2\x94\x80 ng-package.json\n\xe2\x94\x82   \xe2\x94\x9c\xe2\x94\x80\xe2\x94\x80 node_modules\n\xe2\x94\x82   \xe2\x94\x82   \xe2\x94\x94\xe2\x94\x80\xe2\x94\x80 @lib\n\xe2\x94\x82   \xe2\x94\x82       \xe2\x94\x94\xe2\x94\x80\xe2\x94\x80 core -> ../../../core\n\xe2\x94\x82   \xe2\x94\x9c\xe2\x94\x80\xe2\x94\x80 package-lock.json\n\xe2\x94\x82   \xe2\x94\x9c\xe2\x94\x80\xe2\x94\x80 package.json\n\xe2\x94\x82   \xe2\x94\x94\xe2\x94\x80\xe2\x94\x80 src\n\xe2\x94\x82       \xe2\x94\x9c\xe2\x94\x80\xe2\x94\x80 lib\n\xe2\x94\x82       \xe2\x94\x82   \xe2\x94\x9c\xe2\x94\x80\xe2\x94\x80 client.ts\n\xe2\x94\x82       \xe2\x94\x94\xe2\x94\x80\xe2\x94\x80 public-api.ts\n\xe2\x94\x94\xe2\x94\x80\xe2\x94\x80 core\n    \xe2\x94\x9c\xe2\x94\x80\xe2\x94\x80 ng-package.json\n    \xe2\x94\x9c\xe2\x94\x80\xe2\x94\x80 package-lock.json\n    \xe2\x94\x9c\xe2\x94\x80\xe2\x94\x80 package.json\n    \xe2\x94\x94\xe2\x94\x80\xe2\x94\x80 src\n        \xe2\x94\x9c\xe2\x94\x80\xe2\x94\x80 lib\n        \xe2\x94\x82   \xe2\x94\x9c\xe2\x94\x80\xe2\x94\x80 core.ts\n        \xe2\x94\x94\xe2\x94\x80\xe2\x94\x80 public-api.ts\n
Run Code Online (Sandbox Code Playgroud)\n

packages/client/node_modules/@lib-core正如你所看到的,从指向到核心有一个象征意义。这使得当我在本地环境中运行应用程序时,它会找到对 core 的引用。问题是生成构建后,没有链接。

\n

核心/package.json

\n
packages\n\xe2\x94\x9c\xe2\x94\x80\xe2\x94\x80 client\n\xe2\x94\x82   \xe2\x94\x9c\xe2\x94\x80\xe2\x94\x80 ng-package.json\n\xe2\x94\x82   \xe2\x94\x9c\xe2\x94\x80\xe2\x94\x80 node_modules\n\xe2\x94\x82   \xe2\x94\x82   \xe2\x94\x94\xe2\x94\x80\xe2\x94\x80 @lib\n\xe2\x94\x82   \xe2\x94\x82       \xe2\x94\x94\xe2\x94\x80\xe2\x94\x80 core -> ../../../core\n\xe2\x94\x82   \xe2\x94\x9c\xe2\x94\x80\xe2\x94\x80 package-lock.json\n\xe2\x94\x82   \xe2\x94\x9c\xe2\x94\x80\xe2\x94\x80 …
Run Code Online (Sandbox Code Playgroud)

javascript bundle npm angular angular-library

6
推荐指数
1
解决办法
3810
查看次数

注销时关闭所有 ng-bootstrap 模式

如果用户会话超时,那么他将被重定向到登录页面。

问题:如果他们有一个模式打开,那么当用户被重定向时它保持打开状态。

使用ng-bootstrap不涉及将代码放入每个模式(或基类)或包装NgbModal服务的某个事件(会话超时)时关闭任何活动模式的好的集中方式是什么?

我使用Angular 4Bootstrap 4ng-bootstrap

ng-bootstrap angular

5
推荐指数
1
解决办法
2078
查看次数

Python:在文本中查找单词列表并返回其索引

我必须处理纯文本文档,查找单词列表,并在找到的每个单词周围返回一个文本窗口。我正在使用NLTK

我在Stack Overflow上找到了帖子,他们在其中使用正则表达式来查找单词,但没有获取其索引,而只是打印它们。我认为使用RE不正确,因为我必须找到特定的单词。

python text cpu-word nltk

2
推荐指数
1
解决办法
1万
查看次数