Disclaimer: I\'m brand new to Elm
I\'m fiddling around with the online Elm editor and I\'ve run into an issue. I can\'t find a way to get certain special charac
I recently created an Elm package that solves this. If you use text' "©"
it'll render the copyright symbol © instead of the escape code. Also works with "©"
and "©"
. Hope this helps!
Why this is (intentionally) not so easy
The "makers" of Elm are understandably reluctant to give us a way to insert "special" characters into HTML text. Two main reasons:
How it's possible anyway
That said, the Elm user community has found a loophole that affords a workaround. For the reasons above, it's not recommended, especially not if your text is non-constant, i.e. comes from a source outside your program. Still, people will be wanting to do this anyway so I'm going to document it to save others the trouble I had digging everything up and getting it working:
import Json.Encode exposing (string)
elm-lang/core
so it should already be in your dependencies.import Html.Attributes exposing (property)
property "innerHTML"
and a JSON-Value representation of your text, e.g.:span [ property "innerHTML" (string " ") ] []
You don't need to hunt the symbols, you can get them from a list like this one.
If it's too bothersome to copy & paste, you can also create a helper function that you can use with your escaped characters like this:
import Html exposing (..)
import String
htmlDecode str =
let
replace (s1, s2) src= String.join s2 <| String.split s1 src
chrmap =
[ ("®", "®")
, ("©", "©" )
]
in
List.foldl replace str chrmap
main = text <| htmlDecode "hello ©"
You can use directly the unicode escape code in Elm strings and chars:
We have a util module containing all our special chars like:
module Utils.SpecialChars exposing (noBreakSpace)
noBreakSpace : Char
noBreakSpace = '\x00A0'
Which can be used as:
let
emptyLabel = String.fromChar noBreakSpace
in
label []
[ span [ ] [ text emptyLabel ]
]
This will render a <span> </span>
I found, that there is a better solution: you can convert special characters from Unicode to char, and then create a string from char:
resString = String.fromChar (Char.fromCode 187)