Módulos en AngularJS

  • Un módulo AngularJS define una aplicación.
  • El módulo es un contenedor para las diferentes partes de una aplicación.
  • El módulo es un contenedor para los controladores de aplicaciones.
  • Los controladores pertenecen siempre a un módulo.

Creando un módulo:

Un módulo se crea utilizando la función AngularJS angular.module 
<div ng-app="myApp">
  <!-- myApp es como se llama la aplicación -->
</div>
<script>
  //angular.module crea la aplicación
  //app contiene la aplicación
  var app = angular.module("myApp", []);
</script>
  • El parámetro "myApp" hace referencia a un elemento HTML en el que se ejecutará la aplicación.
  • Ahora puede agregar controladores, directivas, filtros y más, a su aplicación AngularJS.
  • El parámetro [] de la definición del módulo se puede utilizar para definir módulos dependientes.
  • Sin el parámetro [], no está creando un módulo nuevo, sino recuperando uno existente.

Módulos en archivos

Es común en las aplicaciones AngularJS poner el módulo y los controladores en archivos JavaScript. 
<div ng-app="myApp">
  <!-- myApp es como se llama la aplicación -->
</div>
<script src="myApp.js"></script>
El archivo myApp.js contiene lo siguiente: 
<script>
  //angular.module crea la aplicación
  //app contiene la aplicación
  var app = angular.module("myApp", []);
</script>

Las funciones pueden contaminar el espacio de nombres global

  • Las funciones globales deben evitarse en JavaScript. Pueden ser sobrescritos o destruidos fácilmente por otros scripts.
  • Los módulos AngularJS reducen este problema, manteniendo todas las funciones locales en el módulo.

Cuándo cargar la biblioteca

  • Si bien es común en las aplicaciones HTML colocar scripts al final del elemento <body>, se recomienda cargar la biblioteca AngularJS en el <head> o al inicio del <body>.
  • Esto se debe a que las llamadas a angular.module sólo se pueden compilar después de cargar la biblioteca.
Agradecimiento a W3C.

0 comentarios:

Publicar un comentario