レコード一覧からテーブル行を動的に作成する方法はありますか

Question

マイモデルタイプは次のとおりです。

type alias Model = 
    { freeSyllables : List FreeSyllable 
    , freeSyllableInput : String 
    , usageStartInput : Bool 
    , usageMidInput : Bool 
    , usageEndInput : Bool 
    } 

FreeSyllableタイプは、次のようになります。

type alias FreeSyllable = 
    { syllable : String 
    , usage : Usage 
    } 

使用タイプは3つのブールフィールドがあります。

type alias Usage = 
    { start : Bool 
    , mid : Bool 
    , end : Bool 
    } 

私が試しをtの各項目をレンダリングするモデルのFreeSyllables-Listをテーブルに追加します。

私は成功しませんでした。

だから私の質問は、私は動的にこれらの列との適切なHTMLテーブルにモデルの「FreeSyllables」のそれぞれをレンダリングすることができる方法である。

• 音節（テキストボックス）
• スタートの使用（チェックボックス）
• 半ばの使用（チェックボックス）
• エンドの使用状況（チェックボックス）
• アクション（セーブ・ボタン）

Answer 1

あなたは、イベントハンドラ（その火メッセージ）を添付する必要がありますが、ここでは一例図であるでしょう：

view : Model -> Html Msg 
view model = 
    table [] <| 
     [ tr [] 
      [ th [] [ text "syllable" ] 
      , th [] [ text "start" ] 
      , th [] [ text "mid" ] 
      , th [] [ text "end" ] 
      , th [] [ text "actions" ] 
      ] 
     ] 
      ++ (List.map viewItem model.freeSyllables) 


viewItem : FreeSyllable -> Html Msg 
viewItem s = 
    tr [] 
     [ th [] [ text s.syllable ] 
     , th [] [ input [ type_ "checkbox", checked s.usage.start ] [] ] 
     , th [] [ input [ type_ "checkbox", checked s.usage.mid ] [] ] 
     , th [] [ input [ type_ "checkbox", checked s.usage.end ] [] ] 
     , th [] [ button [] [ text "save" ] ] 
     ]