在Angular 4应用程序中向下滚动时,我遇到问题.无法检测到滚动事件.
标题放在布局组件中,我想要滚动的内容放在路径组件中.可能那是问题吗？
这是我实现的代码.
在layout.component.ts中
import { Component,OnInit,HostListener,Inject } from '@angular/core';
import { DOCUMENT } from "@angular/platform-browser";
@Component({
selector: 'app-layout',templateUrl: './layout.component.html',styleUrls: ['./layout.component.css']
})
export class LayoutComponent implements OnInit {
public navIsFixed: boolean = false;
constructor(public router: Router,@Inject(DOCUMENT) private document: any) { }
@HostListener('window:scroll',[ ])
onWindowScroll(){
const number = window.pageYOffset ||
document.documentElement.scrollTop ||
document.body.scrollTop || 0;
if (number > 50) {
this.navIsFixed = true;
} else if (this.navIsFixed && number < 10) {
this.navIsFixed = false;
}
}
}
在layout.component.html中
<div [class.fixed]="navIsFixed" class="header">
解决方法
我只是遇到了同样的问题,我所要做的就是确保组件元素实际上是滚动和放大的.具有溢出属性,值为scroll或auto.
否则只是这个工作：
@HostListener('scroll')
public asd(): void {
console.log('scrolling');
}
