The smallest change to fix this is to replace a pair of parentheses with
brackets around the `option`, as below.
import Dict
import Html exposing ( .. )
import Html.Attributes exposing ( .. )
data = Dict.fromList [ ( 1, "Cat"), ( 2, "Jerry" ), ( 3, "Hat" ) ]
type Message = Message
listing : Html Message
listing =
select [ multiple False, size 10 ]
( Dict.foldl ( \key val html -> html ++ [ option [ value ( toString
key ) ] [ text val ] ] ) [] data )
The `++` operator takes two lists, and this fix turns its second argument
into a list containing just one item.
(It works differently from the `::` operator, which takes a single item and
a list, which trips me up sometimes.)
So that answers your direct question. *BUT* I think it's better practice
here to use `foldr` and `::` instead of `foldl` and `++`. The `::` operator
doesn't have to create a whole new list on every iteration, whereas `++`
does. Good idea to get into the habit of spotting this. I try to avoid `++`
inside an iteration because it contains an iteration itself.
So I would do this:
import Dict
import Html exposing ( .. )
import Html.Attributes exposing ( .. )
data = Dict.fromList [ ( 1, "Cat"), ( 2, "Jerry" ), ( 3, "Hat" ) ]
type Message = Message
listing : Html Message
listing =
select [ multiple False, size 10 ]
( Dict.foldr ( \key val html -> ( option [ value ( toString key ) ]
[ text val ] ) :: html ) [] data )
On Monday, March 27, 2017 at 10:45:21 AM UTC+1, Witold Szczerba wrote:
>
> Here you are, working solution:
> https://runelm.io/c/4r0
>
> In case runelm.io becomes unavailable:
>
> module Main exposing (..)
>
> import Dict
> import Html exposing (..)
> import Html.Attributes exposing (..)
>
>
> data =
> Dict.fromList [ ( 1, "Cat" ), ( 2, "Jerry" ), ( 3, "Hat" ) ]
>
> listing : Html msg
> listing =
> select [ multiple False, size 10 ]
> (data
> |> Dict.toList
> |> List.map
> (\( k, v ) -> option [ value (toString k) ] [ text v ])
> )
>
>
> main : Html msg
> main =
> listing
>
>
>
> Regards,
> Witold Szczerba
>
>
> On Mon, Mar 27, 2017 at 12:45 AM, jadski <[email protected]
> <javascript:>> wrote:
>
>> I'm trying to render an html select from a Dict in Elm 0.18, and the
>> compiler complains because Html Msg is not appendable:
>>
>>
>> 12| html ++ ( option [ value ( toString key ) ] [ text val ]
>> ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
>> (++) is expecting the right side to be a:
>> appendable
>> But the right side is:
>> Html msg
>>
>>
>> This should be simple but it's proving frustrating and not obvious - can
>> anyone provide the correct solution for the sample file below? Thanks in
>> advance.
>>
>>
>>
>> import Dict
>> import Html exposing ( .. )
>> import Html.Attributes exposing ( .. )
>>
>>
>> data = Dict.fromList [ ( 1, "Cat"), ( 2, "Jerry" ), ( 3, "Hat" ) ]
>>
>>
>> type Message = Message
>>
>>
>> listing : Html Message
>> listing =
>> select [ multiple False, size 10 ]
>> ( Dict.foldl ( \key val html -> html ++ ( option [ value (
>> toString key ) ] [ text val ] ) ) [] data )
>>
>>
>>
>>
>>
>>
>>
>>
>> --
>> 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] <javascript:>.
>> For more options, visit https://groups.google.com/d/optout.
>>
>
>
--
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.
