2017-11-13 10 views
0

Ich möchte wie etwas tun:Pass Ergebnisse von querySelectorAll zu EventTarget.addEventListener

open Webapi.Dom; 

let addListener = (element) => 
    EventTarget.addEventListener("click", onSubscribeClick, EventTarget.asEventTarget(element)); 

let addOrRemoveListeners = (handler,()) => { 
    let elements = Document.querySelectorAll({j|[$subscriptionIdAttr]|j}, document); 
    Js.Array.forEach(handler, NodeListRe.toArray(elements) |> Js.Array.map(Element.ofNode)) 
    }; 

let addListeners = addOrRemoveListeners(addListener); 

let removeListeners = addOrRemoveListeners(removeListener); 

Aber ich habe einen Fehler in addOrRemoveListeners(addListener);:

This is: 
    (Dom.eventTarget) => unit 
But somewhere wanted: 
    (Dom.node) => unit 

Wie soll ich Dom.eventTarget-Dom.node konvertieren?


Edit: Ich landete mit auf den Punkt:

let addListener = Element.addEventListener("click", onSubscribeClick); 
let removeListener = Element.removeEventListener("click", onSubscribeClick); 
let addOrRemoveListeners = (handler,()) => { 
    let elements = Document.querySelectorAll({j|[$(subscriptionIdAttr)]|j}, document); 
    let() = 
    elements 
    |> NodeListRe.toArray 
    |> Array.map(Element.ofNode) 
    |> Array.to_list 
    |> List.filter(Js.Option.isSome) 
    |> List.map(Js.Option.getExn) 
    |> List.iter(handler); 
() 
}; 
let addListeners = addOrRemoveListeners(addListener); 
let removeListeners = addOrRemoveListeners(removeListener); 

Antwort

1

Kurze Antwort:

external eventTargetToNode : Dom.eventTarget => Dom.node = "%identity"; 

Ein eventTarget kann herauszufinden, keinen guten Weg, was es fast alles, und es gibt leider sein ist. In JavaScript wird es einfach vom Benutzer basierend auf dem Kontext abgeleitet (Es könnte möglich sein, diesen Kontext in einem Typparameter herumzutragen, aber das ist irgendwo in der Zukunft weg).

Für den Moment müssen Sie eine unsichere Besetzung machen, um zu bekommen, was Sie brauchen.

(BTW, können Sie Element.addEventListener verwenden, um die Besetzung von element zu eventTarget zu vermeiden)

+0

Dank! Ich hatte jetzt nicht 'Element' hatte auch' addEventListener' verfügbar. Ich bin die Möglichkeit zu bekommen von 'Element.ofNode' allerdings nicht in der Lage: ' lassen addOrRemoveListeners = (Handler) => { Elemente lassen = Document.querySelectorAll ({j | [dataAttrProductId $] | j}, Dokument); handleOptElement = (Element: option (Element.t)) => Schaltelement { | Keine => (element =>()) | Einige (_element) => Handler }; let _ = Array.iter (handleOptElement, NodeListRe.toArray (Elemente) |> Array.map (Element.ofNode)); () }; ' Wissen Sie warum? –

+0

Ich bekomme ein 'Das ist: (Option (Webapi.Dom.Element.t), 'a) => Einheit Aber irgendwo wollte: (Option (Webapi.Dom.Element.t)) => Einheit' Fehler wenn 'handleOptElement' als erster Parameter von' Array.iter' verwendet wird. –

+0

Endlich behoben, mir fehlte die Unit-Parameter auf 'addOrRemoveListener' :) Ich aktualisierte die Frage mit dem vollständigen Code. –