我试图在使用片段通过 routerlink 导航后滚动到锚点。
** 组件 1 **
<a routerLink="/training/{{ currentTrainingId }}" fragment="{{currentDomainId}}">
Run Code Online (Sandbox Code Playgroud)
这个链接应该将用户带到组件 2。我希望通过给元素一个 id,然后使用片段在 URL 中自动添加 #id 来实现锚点滚动。
** 组件 2 **
<div *ngIf="all data has been loaded">
....
<domain-overview *ngFor="let domain of domains" [id]="domain.id"></domain-overview>
</div>
Run Code Online (Sandbox Code Playgroud)
生成的 URL 似乎是正确的。
http://localhost:4200/training/28#40
Run Code Online (Sandbox Code Playgroud)
但是,锚点滚动不会发生。我认为这与异步加载数据有关。执行锚点滚动时,域尚未加载。
我创建了一个静态 div,然后锚点滚动起作用。
有谁知道如何处理异步数据和锚点滚动?
不要依赖自动锚点滚动,而是编写您自己的滚动功能。根据 @Vinaayakh 他的回答,我得到了以下工作解决方案。
scroll(id){
const elmnt = document.getElementById(id);
elmnt.scrollIntoView({behavior: "smooth", block: "start", inline: "nearest"});
}
this.route.fragment.subscribe((fragment: string) => {
this.fragment = fragment;
});
Run Code Online (Sandbox Code Playgroud)
后来,在加载订阅的完整部分中的所有数据后,我调用滚动函数。
setTimeout(() => {
this.scroll(this.fragment);
}, 250);
Run Code Online (Sandbox Code Playgroud) 我希望有一个图像、javascript、css 等的中心位置,以便在我的 Django 应用程序上启用水平缩放。
目前我正在查看 DigitalCcean 空间,但是在他们的指南中似乎只能使用以下方式手动上传文件:
python manage.py collectstatic
Run Code Online (Sandbox Code Playgroud)
有人有使用 DigitalOcean 空间处理媒体文件的经验吗?我基本上想确保在一台服务器上上传的文件可以由另一台服务器访问。
提前致谢!