異なるファイルからJavaScriptコンストラクタメソッドを呼び出す -

Question

.js.erbビューから.stop()メソッドを呼び出す際に問題がありますが、私はUnobtrusive JavaScript solution for polling in a Rails applicationを使用していますが、これは素晴らしい解決策と思われます。私はポーリングで更新されている項目の1つに対してインライン編集フォームが開いているときにポーリングを停止できるようにしたい。

class Poller 

    constructor: (@div) -> 

    interval: -> 
    $(@div).data("interval") ? 3000 

    url: -> 
    $(@div).data("url") 

    start: -> 
    console.log "Starting polling" 
    @intervalId = setInterval(@request, @interval()) 

    request: => 
    # console.log "Interval: #{@interval()}" 
    # console.log "URL: #{@url()}" 
    console.log "Polling" 
    $.ajax(
     url: @url(), 
     dataType: "script").fail (data) => 
     console.log "Poll failed!" # + JSON.stringify(data) 
     return 

    stop: -> 
    console.log "Stopping polling" 
    clearInterval(@intervalId) 

$(document).on 'turbolinks:load', -> 
    $("div[data-poll='true']").each (i, div) -> 
    console.log "DIV: " + div 
    new Poller(div).start() 

edit.js.erb：

// Pause polling while edit form is open 
console.log($('div#messages[data-poll='true']')); 
new Poller($('div#messages[data-poll='true']')).stop(); 

// $("div[data-poll='true']").each(function(i, div) { 
// console.log("DIV: " + div); 
// return new Poller(div).stop(); 
// }); 

... 

として

unobtrusive_poller.coffee ...私がレンダリングされるedit.js.erbビューから.stop()呼び出し、それがポーリングを続けます私はそれを理解して、問題は@intervalIdは未定義です。

これは正しい経路ですか？

この作業をどのように行うかについてのご意見は、大変ありがたく思います。

ありがとうございます！

Answer 1

ポーリングイベントを初期化する各divのオブジェクトを保存する必要があります。新しいオブジェクトを毎回作成していますが、どこにも格納しません。作成されたオブジェクトの後で停止を呼び出すことができるように、それをどこかに格納する必要があります。

アップデート：このコードは

ハッシュ

にIDを格納あなたが

window.pollHash = {} 

$(document).on 'turbolinks:load', -> 
    $("div[data-poll='true']").each (i, div) -> 
    console.log "DIV: " + div 
    id = $(div).attr("id") 
    pollObject = new Poller(div) 
    pollObject.start() 
    window.pollHash[id] = pollObject 

そしてedit.js.erbで結合されているすべてのポーリングイベントを格納するハッシュマップを作成して、あなたはなかったですnew演算子を使用して新しいオブジェクトを作成します。上記のように既に格納されているオブジェクトを使用し、次に示すようにstopメソッドを呼び出す必要があります。

targetDiv = $('div#messages[data-poll='true']') 
//Not sure about your target condition, replace 
// above selector as your target as per your need. 
targetId = $(targetDiv).attr("id") 
window.pollHash[targetId].stop() 

希望します。