Elm-下拉菜单“ selected”属性在elm中不起作用

Question

我有几个下拉列表中代表的层次结构。

当选择一个项目时，父级下拉选项驱动子级下拉菜单的选项。

当选择一个父对象时，我在子对象下拉列表中添加第一个元素为空白（“”），并显示文本为“ --select--”。

每当父项更改时，我希望该项在孩子的下拉菜单中默认为选中状态。

问题是，“ selected”属性似乎没有发挥作用。

childOptions : String -> Html msg
childOptions val =
    -- This selected attribute does not seem to work
    Html.option [ (Html.Attributes.selected (val == "")), Html.Attributes.value val ] [ Html.text val ]

您可以在此处查看行为：

Ellie编辑器示例

选择父项“ entry 1”，然后选择子项“ 1.2”。

现在选择父项“ entry 2”，并注意它忽略了“ selected”属性，仅当子项为空（“”）时，此属性才为true。现在默认情况下选择的条目是“ 2.2”，对我来说，这表明它保持先前选择的元素“ 1.2”的位置。

关于谁可以解决的任何想法？

Answer 1

问题似乎出在getOptions功能上；因为它的参数不会改变，所以它的输出（每个<option>元素）也不会改变。并且由于输出不会改变，Elm 不会修改元素selected的属性<option>。

（由于没有Msg相应的事件<select>，Elm 看不到更改事件和新值。）

getOptions : String -> Html msg
getOptions val =
    Html.option
        [ Html.Attributes.selected (val == "")
        , Html.Attributes.value val
        ]
        [ Html.text val ]

每个Hierarchy项目都应该跟踪它的selected值，并将其传递给getOptions. 像这样的东西：

getOptions : String -> String -> Html msg
getOptions selectedValue val =
    Html.option
        [ Html.Attributes.selected (val == selectedValue)
        , Html.Attributes.value val
        ]
        [ Html.text val ]