Ember JSのスクロール検出？

Question

Ember JSのスクロールを検出する最適な方法は何ですか？スクロールアクションは組み込まれていません。jqueryを使用することはできますが、配置する場所は不明です。それは私のapplication.jsに入っていますか？それはアプリケーションスコープを持っているか、それともどこかにありますか？

実際のスクロール検出/ロジックはここでは問題ではなく、Emberyの方法でこのようなスクリプトを設定する方法です。理想的には、スクロール

は、アクションになり、そしてapplication.jsファイルでそのように扱うことができます。私たちはエンバーに実装されていません/登録解除イベントを登録するには、ライフサイクルフックを使用する作業で

import Ember from 'ember'; 

export default Ember.Route.extend({ 
    actions: { 
     onScroll: function() { 
      alert('scrolled'); 
     } 
    } 
}); 

Answer 1

私はこのawesome library,ember-perfectscrollを使用して終了しました。それは必要なテンプレートをラップし、大量の有用なCSSクラス/関数を提供します。

Answer 2

。私たちは、特定の名前空間（多くの場合、コンポーネントのID）にjQueryのイベントをアンバインド/バインドするdidInsertElementとwillDestroyElementにライフサイクルフックを使用：https://guides.emberjs.com/v2.8.0/components/the-component-lifecycle/

コード例：

import Ember from 'ember'; 

export default Ember.Component.extend({ 

    didInsertElement() { 
    this._super(...arguments) 

    // Register your events here 
    Ember.$(document).on('scroll.my-namespace', 'body', this.eventHandler) 
    // this.$ if the element is located inside the component 
    }, 

    willDestroyElement() { 
    this._super(...arguments) 

    Ember.$(document).off('scroll.my-namespace') 
    // this.$ if the element is located inside the component 
    }, 

    eventHandler(ev) { 
     //Do sth with event 
    } 

}) 

可能性が別の方法Ember.Eventedを拡張するサービス。そのサービスでは、jQueryイベントリスナーを登録することもできます。スクロールイベントをリッスンする必要があるコンポーネントは、サービス（http://emberjs.com/api/classes/Ember.Evented.html）を購読することができます。