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

Angular Tutoriales | | Comunidad: Crear un Post, Eventos Devs, Foro

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: https://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
Subscribirse
Notificar a
guest
6 Comments
antiguos
nuevos más votado
Inline Feedbacks
View all comments
fernando vasquez
fernando vasquez
3 años atrás

que paso con el angularjs 3 ?

Collective Cloud Peru
Collective Cloud Peru
Reply to  fernando vasquez
3 años atrás

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… Leer más »

Gabriel Rodriguez
Gabriel Rodriguez
3 años atrás

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?

Collective Cloud Peru
Collective Cloud Peru
Reply to  Gabriel Rodriguez
3 años atrás

Meciona más detalles de tu problema para ayudarte 🙂

Bastian
Bastian
3 años atrás

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.

Collective Cloud Peru
Collective Cloud Peru
Reply to  Bastian
3 años atrás

Si Bastian, las nuevas versiones solucionan muchos problemas y son mejores.