Angular 2 – Router – ¿Necesitaremos UI-Router?

ACTUALIZADO (2017/04/24): De beta a release se añadió una nueva forma de enrutamiento y se deprecó lo que llama oldRouter. Con la nueva forma si queremos hacer nested views deberán de tener formatos no estándares como por ejemplo /lessons(aside:playlist). Por eso se recomienda el uso de @uirouter/angular (Github). *aside sería el contenedor (outlet) *playlist: el path del…

Angular 2 – TypeScript en runtime

Otra opción si queremos ejecutar TypeScript en el navegador es hacerlo on the fly o en tiempo de ejecución. Vamos a ver que diferencias tenemos entre estas formas.   Tendremos la siguiente estructura:  │ │ index.html│└───src app.ts main.ts   index.html   <!DOCTYPE html> <html> <head> <title>Angular 2 – Typescript in runtime</title> <script> var start = new Date().getTime();…

Angular 2 – Router

  Hoy vamos a hacer un sencillo ejemplo de como utilizar el routing que incluye Angular 2.   HTML   <!DOCTYPE html> <html> <head> <meta name=”viewport” content=”width=device-width”> <title>Angular 2</title> <link rel=”stylesheet” href=”https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css”> <link rel=”stylesheet” href=”https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap-theme.min.css”> </head> <body> <h1>Angular 2</h1> <p>Testing Angular 2 with TypeScript</p> <my-app></my-app> </body> </html> <script src=”https://github.jspm.io/jmcriffey/bower-traceur-runtime@0.0.90/traceur-runtime.js”></script> <script src=”https://jspm.io/system@0.16.js”></script> <script src=”https://code.angularjs.org/2.0.0-alpha.35/angular2.dev.js”></script> <script src=”https://code.angularjs.org/2.0.0-alpha.35/router.dev.js”></script><!–add…

Angular 2 – Gulp – Transpile múltiples ficheros de Typescript a ES5 y organizar proyecto

  Si miramos en la documentación de angular.io nos deja un ejemplo de como podemos pasar de typescript a ES5 un sólo fichero. En este artículo veremos como podemos transformar múltiples a la vez y de paso como organizar un proyecto.   Precondición Tenemos instalados los paquetes descritos en los pasos de angular.io. Paso 1 y 2.…