遅延ロードがときどき角度で動作しない

Question

次のコードでいくつかの奇妙な動作が発生しています。

function linkFunc(scope, element, attribute) { 
     var page = angular.element($window); 

     page.bind('scroll', function() { 

      var windowHeight = "innerHeight" in window ? window.innerHeight : document.documentElement.offsetHeight; 
      var body = document.body, html = document.documentElement; 
      var docHeight = Math.max(body.scrollHeight, body.offsetHeight, html.clientHeight, html.scrollHeight, html.offsetHeight); 
      var windowBottom = windowHeight + window.pageYOffset; 

      if (windowBottom >= docHeight) { 
       scope.$apply(attribute.myDirective); 
      } 
     }); 
    } 

上記は、ページの下部に到達したかどうかを検出するコードの一部であるその達した場合、それが主な問題は、時間のほとんどであるmyDirective

にどんな機能バインドを呼び出します遅延ロードが機能し、myDirectiveが正常に呼び出されます。しかし、怠惰な読み込みはうまくいかず、私はバグを再現できませんでした。

私は別の画面サイズ、別のブラウザを試しましたが、バグがランダムに発生するようです。

誰かがこれまでにそれらに起こったことがありますか、私に方向性を指摘することができますか？

編集：

詳しい情報

私は実験の少し後にバグを再現することができました。ブラウザの割合でズームが< 100 %とき

基本的には、window.pageYwindowBottomは0.1

例えば0.9にでオフにさせるその少し不正確である10進値を返します。

  console.log(windowBottom); // 1646.7747712336175 
      console.log(docHeight); // 1647 

これはなぜ起こるのですか？

編集2：

上記の動作も非決定論的であるが、小数部が真です。 ！

Answer 1

0.1 + 0.2 == 0.3

この1つだけではなく、JavaScriptで風変わりです。実際にはコンピュータサイエンスの一般的な問題であり、多くの言語に影響します。これの出力は0.30000000000000004です。

これは、機械精度と呼ばれる問題と関連しています。上記の行をJavaScriptが実行しようとすると、値は2進数に変換されます。 ここが問題の始まりです。 0.1は実際には0.1ではなく、バイナリの等価物であり、これはほぼish（同じではない）値です。本質的には、値を書き込むとすぐに、それらの精度を失うことになります。 2つの単純な小数点がほしいと思っただけかもしれませんが、Chris Pineが指摘しているように、バイナリ浮動小数点演算です。あなたのテキストをロシア語に翻訳したいが、Belorussianを得たいと思うようなもの。同様ですが、同じではありません。

hereを読むことができます。ブラウザのソースを掘り下げることなく、私はあなたの問題がこれに由来すると推測します。

Answer 2

浮動小数点精度の問題がある場合、2つの値が1ピクセルよりも小さい場合は、条件を緩和して確認することができます。例：

if (Math.abs(windowBottom - docHeight) < 1) { 
    scope.$apply(attribute.myDirective); 
}