How to pass two text values in html.text

Learn
1

I have a dropdown with text as more details and up on clicking it will show some info below that line . What i am trying to achieve is up on expanding the ‘more detail’ text should change to ‘less detail’
this is my code

                 [ Html.text "More detail"
                                , Html.i [ Attributes.class "material-icons" ]
                                    [ if expanded then
                                        Html.text "keyboard_arrow_up"

                                      else
                                        Html.text "keyboard_arrow_down"
                                    ]

kindly help

2 
[ Html.text 
  (if expanded then
    "Less detail"
  else
    "More detail"
  )
, Html.i [ Attributes.class "material-icons" ]
  [ if expanded then
      Html.text "keyboard_arrow_up"

    else
      Html.text "keyboard_arrow_down"
  ]
1 Like
3

To be honest, for situations like this I have created a small helper called iif (I call it “in-line if”).

iif : Bool -> a -> a -> a
iif cond trueValue falseValue = 
    if cond then 
        trueValue 
    else 
        falseValue

With that function, your code becomes:

                 [ Html.text "More detail"
                                , Html.i [ Attributes.class "material-icons" ]
                                    [  Html.text <| iif expanded  "keyboard_arrow_up" "keyboard_arrow_down" ]
3 Likes
4

thanks man this works

5

thanks for the help man.

6

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.