Scribd
Cargar
23 vistas

Sesion5 - Javascript AngularJS

El documento introduce conceptos básicos de AngularJS como framework Javascript, MVC, componentes como módulos, vistas, controladores, servicios y directivas. Explica el uso de directivas como ng-if, ng-repeat y ng-view para manejar condiciones, bucles y rutas en Angular.

Cargado por

abel20113636
Derechos de autor
© © All Rights Reserved
Formatos disponibles
Descarga como PPTX, PDF, TXT o lee en línea desde Scribd
23 vistas

Sesion5 - Javascript AngularJS

El documento introduce conceptos básicos de AngularJS como framework Javascript, MVC, componentes como módulos, vistas, controladores, servicios y directivas. Explica el uso de directivas como ng-if, ng-repeat y ng-view para manejar condiciones, bucles y rutas en Angular.

Cargado por

abel20113636
Derechos de autor
© © All Rights Reserved
Formatos disponibles
Descarga como PPTX, PDF, TXT o lee en línea desde Scribd
Está en la página 1/ 11

Introduccin a AngularJS

Taller: Javascript frameworks


Sesin V
Autor: Puridiom-PE

Conceptos

Framework Javascript

Modelo Vista Controlado (MVC)

Model View ViewModel (MVVM)

Data binding

Single Page Application (SPA)

Inyeccin de dependencia

Arquitectura

Componentes

Mdulos (directiva ng-app, objeto javascript)

Vistas (archivos html)

Controlador (directiva ng-controller, objeto javascript)

Servicios (objeto javascript)

Directivas (objeto javascript con representacin html)

Objeto Scope (Objeto javascript asociado al html, frecuentemente usado con


las directivas ng-model y ng-click)

Templates (archivos html reutilizables)

Routing (objeto javascript que define la navegacin de una aplicacin Angular)

Expresiones (cdigo javascript usado en html {{ }})

AngularJS - Mdulos

Un mdulo es un contenedor de la aplicacin

angular.module() define un objeto mdulo

ng-app es la directiva predefinida para definir un mdulo en una aplicacin


Angular. Se recomienda utilizar esta directiva cerca de la raz de la pgina
(<html>, <body>)

AngularJS - Controladores

Manejan los datos y eventos en las aplicaciones en la vista asociada

Son objetos javascript que pertenecen a un mdulo

Estan asociados a una vista o porcin de una vista mediante la directiva


predefinida ng-controller

AngularJS Ejemplo bsico

AngularJS Directiva ng-if

Maneja eventos de condicin para los elementos dentro del scope y controlador
correspondiente:

Al igual que un if normal retorna nicamente true or false, se utiliza para


mostrar elementos si la variable (imagen) task.id es false.

AngularJS Directiva ng-repeat

Maneja bucles de informacin imprimiendo los datos que se le den como parmetros:

(imagen) Collection es la coleccin de datos en el primer div recorre todos los


elementos e imprime los que cumplen con ng-if == tem.type ==city

El segundo ng-repeat recorre al igual que el anterior nicamente que ahora ng-if
tiene la condicin de tem.type==country

AngularJS Directiva ng-view

Maneja vistas dinmicas html :

La etiqueta con la propiedad ng-view es donde cargara el html asociado a la URL actual del
navegador, esta asociacin de realiza en la configuracin del modulo utilizando
$routeProvider.

AngularJS Directiva ng-include

Maneja la inclusin de vistas estticas html :

El cdigo html del archivo enviado como parmetros es impreso en la pagina


padre.

También podría gustarte