スクロール後のヘッダーの修正角度4

Question

スクロール後にヘッダーを修正する際に問題が発生しましたが、たくさん試しましたが、動作させることはできません。私はこのスレッドをチェックしましたが、それは私のために働きません：Angular 4 @HostListener Window scroll event strangely does not work in Firefox。

• レイアウト
  • ステップ
• ルート

内のステップ私はは50pxのためにスクロールした後、修正したい私のヘッダーは次のとおりです。これは私のコンポーネントの構造です。内部レイアウトは、ロゴの背景を持つdivのような他のコンテンツです（ステップの内容の上にあります）。

これは私がSteps.ts

@HostListener('window:scroll', []) 
    onWindowScroll() { 
    const number = window.scrollY; 
    if (number > 40) { 
     this.fixed = true; 
    } else if (this.fixed && number < 10) { 
     this.fixed = false; 
    } 
    } 

の内側にしようとしたものですが、問題は、スクロールが全くトリガされていないということです。私はexamples スクロールがイベントを記録する場所を見つけましたが、私にとってはうまくいきませんでした（$イベントも試しました）。誰にでも解決策がありますか？

Answer 1

解決策が見つかりました。私のレイアウトコンポーネントに私は機能

(scroll)="onWindowScroll($event)" 

を入れて、レイアウトコンポーネントに私が使用：

@HostListener('window:scroll', ['$event']) 
    onWindowScroll($event) { 
    const number = $event.target.scrollTop; 
    if (number > 40) { 
     this.fixed = true; 
    } else if (this.fixed && number < 10) { 
     this.fixed = false; 
    } 
    } 

を私はもうそれを必要とするdidntのため、階段のコンポーネントを削除し、すべてのコンテンツは現在のレイアウト内にあります。角度で

Answer 2

は、それは少し違う作品5.2.5：

const number = $event.target.documentElement.scrollTop;