Ejemplo del post "Otro sorbo de TEA"

tea2.elm

module Counter exposing (..)

import Html exposing (..)
import Html.Attributes exposing (..)
import Html.Events exposing (..)


programParams =
    { model = modelo
    , view = vista
    , update = actualizar
    }


main =
    Html.beginnerProgram programParams



-- MODEL


modelo =
    { cont = 0
    , incremento = 1
    }



-- UPDATE


type Msg
    = Incrementar
    | Decrementar
    | CambiarIncremento String


actualizar mensaje miModelo =
    case mensaje of
        Incrementar ->
            { miModelo | cont = miModelo.cont + miModelo.incremento }

        Decrementar ->
            { miModelo | cont = miModelo.cont - miModelo.incremento }

        CambiarIncremento incr ->
            { miModelo | incremento = Result.withDefault 0 (String.toInt incr) }



-- VIEW


vista miModelo =
    div []
        [ span [ style [ ( "padding", "5px" ) ] ] [ text (toString miModelo.cont) ]
        , button [ onClick Incrementar ] [ text "+" ]
        , button [ onClick Decrementar ] [ text "-" ]
        , input [ type_ "number", value (toString miModelo.incremento), onInput CambiarIncremento ] []
        ]