2016-06-15 5 views
1

Gegeben eine Liste von String, ich möchte eine Liste von HTML div erstellen, um es in Sicht zu injizieren: Ich fragte mich, ob die Funktion Unterschrift sein sollte folgende:ELM: Fehler beim Einbetten (Liste von HTML) in div second Argument

display : List String -> List Html div 

und die Funktion Körper:

display model = case model of 
    [] -> [] 
    (x::xs) -> div [][ text x] :: display xs 

wenn in der Ansicht, die die obige Funktion embeding nach unten die (wie ich die div Funktion übernimmt eine Liste des Html als zweites Argument kennen div : List Attribute -> List Html -> Html)

view : Model -> Html Msg 
    view model = div [] 
        [ 
        input [ placeholder "write your post here" , onInput Change][] 
        , button [onClick Save ][text "save"] 
        ,div [][ display model.lst ] 

Ich erhalte die folgenden Fehler beim Kompilieren:

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

24|      div [][ display model.lst ] 
           ^^^^^^^^^^^^^^^^^^^^^ 
Function `div` is expecting the 2nd argument to be: 

    List (VirtualDom.Node a) 

But it is: 

    List (List (Html a)) 

, wie ich das aussortieren könnte, DANK

Antwort

4

Die Fehlermeldung über die Linie div [][ display model.lst ] besagt, dass Sie versuchen, Betten Sie eine Liste in eine Liste ein. Da der Rückgabewert display bereits eine Liste ist, müssen Sie ihn nicht in Klammern umbrechen. Versuchen Sie stattdessen:

div [] (display model.lst) 

Sie werden dann sehen, dass es für display ein Problem mit der Typanmerkung ist. Ihnen fehlen einige Klammern, da List nur ein einziges Argument vom Typ akzeptiert. Es sollte sein:

display : List String -> List (Html div) 

Und als eine Randnotiz, in dieser Signatur für display, haben Sie Html div. Das div bedeutet nicht, dass es ein tatsächliches div zurückgibt. Ein kleingeschriebenes Label in einer Typ-Annotation bedeutet grundsätzlich, dass alles dorthin gehen kann. Sie werden oft sehen, dass Leute Kurzschrift-Typen dafür verwenden, wie Html a, da die Eingabe div dort verwirrend sein kann. Eine andere Alternative besteht darin, mit dem Rest des Ansichtscodes konsistent zu sein und Html Msg zu verwenden. Wie auch immer, in diesem speziellen Fall ist es in Ordnung; Es ist nur eine Frage der Konvention.

+0

ich danke Ihnen für Ihre Informationen, ich finde diese "Ein kleingeschriebenes Etikett in einem Typ Anmerkung im Grunde bedeutet, dass alles dort hingehen kann" ein bisschen verwirrend, könnte bitte erarbeiten –

+1

Ober- und Kleinbuchstaben in Elm sind in mehrfacher Hinsicht signifikant. Werfen Sie einen Blick auf den Abschnitt [Reading Types] (http://guide.elm-lang.org/types/reading_types.html) des Handbuchs. –