Actualizar la versión de Angular 2 a la versión de Angular 4

Tutoriales

El día 23 de Marzo de 2017 los ingenieros de Software de Google lanzaron la versión 4 del Popular Framework Javascript MVC (Modelo Vista Controlador) , en esta versión incluyen mejoras tales como velocidad y menos peso del core de archivos del Framework, así mismo mejoras en la animación, nuevas sintaxis en la vista con *ngIf y *ngFor , compatibilidad con TypeScript 2.1 y TypeScript 2.2 entre otras caracteristicas, en este tutorial vamos a migrar Angular 2 a su versión 4.

Cabe resaltar que Google tiene planeado lanzar la versión 5 de Angular para este año 2017 según vemos en su blog:

Fuente: http://angularjs.blogspot.pe/2016/10/versioning-and-releasing-angular.html

Bien vamos a actualizar de la 2 a la 4.

Primero debemos constatar que versión de Angular tenemos actualmente, para ellos podemos abrir el archivo package.json y veremos las dependencias de angular:

Ahora para actualizar según nuestros amigos de Google debemos simplemente abrir nuestra consola para copiar y pegar:

Para Linux/Mac:

Para Windows:

 

Por ejemplo colocamos en nuestra consola así y presionamos ENTER para que el sistema trabaje por si solo:

Terminado el proceso de actualización volvemos a abrir nuestro archivo package.json y tendremos actualizadas nuestras dependencias de Angular a la versión 4:

Eso es todo tu versión de angular se ha actualizado.

Ahora voy a implementar un hola mundo para ello instancio mis dependencias  junto con mi app:

ahora en mi vista coloco mi selector <hola-mundo-txt> en donde imprimiré mi Hola mundo

Creo mi componente con el nombre hola-mundo.component.js:

Con esto tengo mi hola mundo, estoy aplicando estructura de Angular 2, es cuestión de leer la documentación de Angular 4 para ver las nuevas formas de crear los templates, acá estoy demostrando que la estructura de Angular 2 funciona en Angular 4. Mas adelante haré un tutorial con las version de Angular 4.

Espero les sirva de mucho, no olvides seguirnos en nuestras redes sociales y suscribete a nuestro canal de Youtube.

 

 

 

Newsletter

Suscríbete a Nuestro Boletín de Novedades:

(Luego de la suscripción no te va salir ningun mensaje. Solo revisa tu bandeja de Correo para confirmar tu suscripción)
* indicates required
  • fernando vasquez

    que paso con el angularjs 3 ?

    • Hola Fernando gracias por visitar nuestro blog, te explico:

      La razón por la cual no hay una versión 3 de Angular es porque la versión del módulo Router de Angular 2 es la version 3.3.x y el resto de los módulos tiene versiones 2.3.x. El equipo de Angular quiere que todos los módulos estén en la misma versión ‘mayor’ y por eso van a ‘saltarse’ la versión 3 del framework. La versión 4 es una versión estable de Angular (no se llama Angular 4, solamente Angular).

      Esta nueva versión del framework es compatible con la versión 2 y no tenemos que adaptarnos de nuevo a aprender desde cero la nueva plataforma, algo que nos ayuda mucho.

      Así mismo Angular 5 estará lista en Septiembre del 2017, la versión 6 en Marzo del 2018 y así sucesivamente.

  • Gabriel Rodriguez

    Buenas
    Intenté hacer lo que dices, pero cuando intento crear la carpeta desde ng new carpeta, el JSON cuando lo abro dice que tengo la versión de angular 2. Qué debo hacer?

  • Bastian

    Hola las apps que tengo en angular 1 ya no podría correrlas ni gestionarlas, lo que pasa es que uso una librería para carro de compras y no creo que me funcione haciendo la migración. Se que debo pasarme a angular 2 de ahora en adelante.