Nice, this totally works!
Is there a way to not have to specify keys for *every* child? Instead only
specify keys on the children that need it?
Right now I have
view : Model -> Html Msg
view model =
node "div"
[]
[ ( "textarea", textarea [ onInput Change ] [] )
, ( "katex-container", div [ id "katex" ] [] )
, ( ("katex-" ++ (toString (FNV.hashString model))), Html.node
"script" [] [ text ("katex.render('" ++ model ++ "',
document.getElementById('katex'))") ] )
]
Which seems really redundant for the textarea/container, both of which do
not need a key since they're static parts of the page...
The only way that seems doable is to do some kind of wrapping, which is
less than ideal.
Eg, wrap the script in a div, which is a keyed node with one child. This
also seems a little redundant - compromising the code quality?
One other question - how do I run elm-reactor with a custom index.html file
that loads necessary 3rd party resources (like katex.min.js)?
On Thursday, February 16, 2017 at 2:15:43 PM UTC-8, Maxwell Gurewitz wrote:
>
> You're going to want to use
>
> http://package.elm-lang.org/packages/elm-lang/html/2.0.0/Html-Keyed
>
> On Tuesday, February 14, 2017 at 5:41:11 PM UTC-8, [email protected]
> wrote:
>>
>> Hi all!
>>
>> Just started using Elm and I'm really liking it.
>>
>> One question I had is whether it is possible to integrate a library like
>> KaTeX that actually modifies the content of a DOM element that is
>> controlled by Elm.
>>
>> If so how would I do that? React/Mithril have ways of interrupting the
>> rendering lifecycle to squeeze in your own behavior, but how does Elm allow
>> for that?
>>
>> Another simple way to do it is to render a script tag, like:
>>
>> <div id="katex">
>> <script> KaTeX.render('...', document.getElementById('katex')) </script>
>>
>> I can render a script element, but I need to force elm to re-render the
>> script tag each time, and for that, React allows you to put a key
>> attribute. Is there something similar in Elm?
>>
>> There are a lot of other widget-like js libraries that I wanted to
>> include on my webpage, like musicalabc (abcjs) or mermaid.js, or
>> highlight.js, etc.
>>
>> Any ideas? Thanks!
>>
>> Vishesh
>>
>
--
You received this message because you are subscribed to the Google Groups "Elm
Discuss" group.
To unsubscribe from this group and stop receiving emails from it, send an email
to [email protected].
For more options, visit https://groups.google.com/d/optout.
