在示例中,当将列表映射到html时,我总是看到类似的东西
ul []
List.map toHtmlFunction myList
但是,如果列表只是子html元素的一部分,那该怎么办呢
...
table []
[
thead []
[
th [][text "Product"],
th [][text "Amount"]
],
List.map toTableRow myList,
tr []
[
td [][text "Total"],
td [][text toString(model.total)]
]
]
toTableRow: MyListItem -> Html Msg
toTableRow myListItem =
tr []
[
td[][text myListItem.label],
td[][text toString(myListItem.price)]
]
有了这个代码,我得到了
The 1st element has this type:
VirtualDom.Node a
But the 2nd is:
List (Html Msg)
最佳答案 问题是thead和tr是Html a类型,而List.map返回一个List(Html a),它们不能仅使用逗号组合.
您可以在List package中查看将列表放在一起的功能.例如,您可以执行类似的操作
table []
List.concat [
[ thead []
[ th [][text "Product"]
, th [][text "Amount"]
]
],
List.map toTableRow myList,
[ tr []
[ td [][text "Total"]
, td [][text toString(model.total)]
]
]
]