• Backbone: Bajo nivel para los frameworks actuales.
• Knockout: Se queda corto
• Ember: Sería la alternativa a AngularJS

• Aplicaciones SPA
• Inyección de dependencias y módulos
• Enlace de datos (data binding)
• Modelo mediante POJSOs
• Extiende el vocabulario de HTML (directivas)
  
• Pensado para hacer testing
• Está de moda

• input con type:
  • text : String
  • number : number
  • checkbox : boolean
• No existe el tipo Date (No vale type='date')

• Son tag o atributos HTML específicos de AngularJS
• Modifican el DOM
• Lo mejor: Te puedes crear tus propias directivas

• ng-show: Mostrar un elemento
• ng-hide: Ocultar un elemento
• ng-disabled: Deshabilitar un elemento
• ng-click: Llamar a una función del $scope

• ng-repeat: Repetir tags
• ng-options: Rellenar un <select>
           label for variable in array

• ng-src: Evita que se muestra el icono de imagen no encontrada.
• ng-href: Evita que se pinche en un link
• ng-bind: Evita que se vean los {{ }}
• ng-cloak: Evita que se vea una zona no visible
• ng-attr-*: Para cualquier otro atributo estándar HTML (v.1.2)

• Escalares
  • lowercase / uppercase
  • number
  • date
  • currency
• Arrays
  • orderBy
  • limitTo
  • filter

• Son funcionalidades de la aplicación no relacionadas con el interfaz gráfico
• Nunca acceden a la página (DOM)
• Siempre son Singletons
• Se obtienen mediante inyección de dependencias

• $http
• $log

• constant
• value
• factory
• service
• provider

• En cualquier función de AngularJs se puede inyectar un servicio

app.controller("MainCtrl",function ($http,$log) {
//Ahora podemos llamar a los servicios $http y $log
 
})

app.controller("MainCtrl",['$http','$log',function ($http,$log) {
//Ahora podemos llamar a los servicios $hhtp y $log
 
}])

Agrupan funcionalidades 

para posteriormente 

añadirlas a la aplicación

• Definen nuevos:
• Controladores
• Directivas
• Filtros
• Servicios

• Ejecutan código al cargar el módulo:
  • config: Código de configuración
  • run: Código "Main"

• Indica el nombre del módulo inicial a cargar
• El resto de módulos de cargan como dependencias de éste último

Creando un módulo:

angular.module("nombre",['nombreOtroModulo']);

Obteniendo un módulo:

var modulo=angular.module("nombre");

Usando el módulo para definir un controlador:

modulo.controller("MiController",function($scope) {});

function ServicioNombres() {
  this.nombre="Lorenzo";
  
  this.getNombre=function() {
    return this.nombre;
  }
}

modulo.service("servicioNombres",ServicioNombres);

modulo.controller('MainCtrl',['servicioNombres',function(servicioNombres) {

var nombre=servicioNombres.getNombre();

}]);

function mostrar() {
    return {
        restrict: 'A',
        link:function($scope, element, attributes) {  };  
    }
}

modulo.directive('mostrar', mostrar);

El Objeto tiene las propiedades:

• restrict
• link

• Validan el contenido de los <input>, no del modelo en el $scope
• Se compone de:
  • Directivas
  • Clases CSS
  • JavaScript Formulario
  • JavaScript <input>

• min: Valor mínimo de un número
• max: Valor máximo de un número
• ngRequired: Si es requerido
• ngMinlength: Tamaño mínimo de un String
• ngMaxlength: Tamaño máximo de un String
• ngPattern: Expresión regular que debe cumplir

• ng-valid: Cuando es válido
• ng-invalid: Cuando es inválido
• ng-pristine: Cuando NO se ha modificado su valor
• ng-dirty: Cuando ha sido modificado su valor

• nombreFormulario.$pristine : Vale 'true' si no se ha modificado ningún valor
• nombreFormulario.$dirty: Valor 'true' si se ha modificado algún valor.
• nombreFormulario.$valid: Vale 'true' si todos los campos del formulario son válidos.
• nombreFormulario.$invalid: Vale 'true' si algún campo del formulario es inválido.

• nombreFormulario.nombreInput.$error.nombreError : Vale 'true' si ese error ha fallado.
• Siendo nombreError:
• min
• max
• required
• minlength
• Etc.