Scribd Logo
Cargar

¡Te damos la bienvenida a Scribd!

  • Tutorial Sencillo de AngularJS

    Cargado por

    Cristian Sandoval Villegas
    7 vistas17 páginas
    Tutorial Angular JS

    Derechos de autor

    © © All Rights Reserved

    Formatos disponibles

    PDF, TXT o lea en línea desde Scribd

    ¿Le pareció útil este documento?

    ¿Este contenido es inapropiado?

    Denunciar este documento
    Tutorial Angular JS

    Copyright:

    © All Rights Reserved
    Descargue como PDF, TXT o lea en línea desde Scribd
    Marcar por contenido inapropiado
    7 vistas17 páginas

    Tutorial Sencillo de AngularJS

    Cargado por

    Cristian Sandoval Villegas
    Tutorial Angular JS

    Copyright:

    © All Rights Reserved
    Descargue como PDF, TXT o lea en línea desde Scribd
    Marcar por contenido inapropiado
    de 17

    ANGULARJS

    INTRODUCCIN Y PRIMEROS
    PASOS
    /

    QU ES ANGULARJS
    Una tecnologa nueva en la capa de cliente que nos permite
    realizar cosas chachis en nuestras pginas sin necesidad de
    montar jaleos de cdigo. Separa muy bien la
    responsabilidad de cada tecnologa en su mbito: CSS,
    HTML y Javascript, y las comunica cuando lo considera
    necesario.

    POR QU ANGULARJS
    No manosees el rbol DOM para
    acceder al valor de un elemento.

    //Estonooooooporfavoooor!
    vartitulo=$("#elem").up("li").first("p").down("span.olala").val();

    //Estosevemejor:)
    vartitulo=$scope.titulo;

    POR QU ANGULARJS
    Esto se consigue actualizando la vista automticamente
    cuando cambia el modelo, o viceversa.

    POR QU ANGULARJS
    Disponemos de plantillas que extienden el vocabulario del
    cdigo HTML para proporcionarnos la introduccin de
    lgica en la representacin de nuestra informacin.

    <divngcontroller="AlbumCtrl">
    <ul>
    <lingrepeat="imageinimages">
    <imgngsrc="{{image.thumbnail}}"alt="{{image.description}}">
    </li>
    </ul>
    </div>

    POR QU ANGULARJS
    3.

    . Permite crear componentes (directivas)


    fcilmente reutilizables (que permiten aislar totalmente
    su funcin, no chocan con otros).

    4.

    . Al tener componentes aislados, podemos testear


    su comportamiento de manera independiente.

    5.

    . Si necesitamos hacer uso de


    un servicio, lo inyectamos en nuestro controlador
    directamente y funciona.

    VOCABULARIO
    . Es el responsable de detectar los cambios en el
    modelo y proporciona el contexto a las plantillas.

    <!doctypehtml>
    <htmlngapp>
    <head>...</head>
    <body>
    <divngcontroller="GreetCtrl">
    Hello{{name}}!
    </div>
    <divngcontroller="ListCtrl">
    <ol>
    <lingrepeat="nameinnames">{{name}}</li>
    </ol>
    </div>
    </body>
    </html>

    VOCABULARIO
    . Es el cdigo con la lgica que comunica el
    modelo con la vista.

    VOCABULARIO
    . Son los datos, que junto con la plantilla producen
    las vistas.

    VOCABULARIO
    . Lo que el usuario visualiza. Parte de una plantilla, se
    funde con el modelo y se renderiza en el rbol DOM.

    VOCABULARIO
    . Lo que el usuario visualiza. Parte de una plantilla, se
    funde con el modelo y se renderiza en el rbol DOM.

    MONTANDO LA
    INFRAESTRUCTURA

    $gitclonehttps://github.com/tombatossals/angularjstutorial
    $gitcheckoutphase1

    MS DIRECTIVAS Y
    SERVICIOS

    $gitclonehttps://github.com/tombatossals/angularjstutorial
    $gitcheckoutphase2

    . Nmeros decimales.
    . Esperar antes de renderizar la plantilla.
    . Inspeccionando variables del modelo.
    . Enrutador.
    . Cargar mini-plantillas.
    . Tests End-to-End.

    También podría gustarte