在列表中創建元素以創建元素

這似乎設置正確，但顯然不是，我也看不到它出錯的地方。我試圖遍歷「對象列表」，併爲列表中的每個項目創建一個ul和li，並將它們放在div的內部。忽略涉及ID的所有內容。我有一種感覺，我不完全確定List.map如何返回。在列表中創建元素以創建元素

type alias Product = 
    { a : String 
    , b : String 
    , c : Int 
    , d : String 
    , e : String 
    } 

type alias Model = 
    { id : String 
    , products : List Product} 

view : Model -> Html Msg 
view model = 
    div [] 
    [ input [ type' "text", onInput UpdateText ] [] 
    , button [ type' "button", onClick GetProduct ] [ text "Search" ] 
    , br [] [] 
    , code [] [ text (toString model.products) ] 
    , div [] [ renderProducts model.products ] 
    ] 

renderProduct product = 
    let 
    children = 
     [ li [] [ text product.a ] 
     , li [] [ text product.b ] 
     , li [] [ text (toString product.c) ] 
     , li [] [ text product.d ] 
     , li [] [ text product.e ] ] 
    in 
    ul [] children 

renderProducts products = 
    List.map renderProduct products

誤差如下：

The 2nd argument to function `div` is causing a mismatch. 

    78|  div [] [ renderProducts model.products ] 
      ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ 
Function `div` is expecting the 2nd argument to be: 

    List (VirtualDom.Node a) 

But it is: 

    List (List (Html a))

來源

2016-11-10 Steven Wade

renderProducts返回元素的列表。 div的第二個參數需要一個元素列表。通過將第二個參數括在括號中，您將創建一個包含單個元素列表的列表。這就是爲什麼錯誤消息指出

But it is: 

    List (List (Html a))

而應該這樣做：

div [] (renderProducts model.products)

來源

2016-11-10 20:30:20

感謝。我知道它必須是某種疏忽。 –

在列表中創建元素以創建元素

回答

相關問題