3.0 / 5
Jlopezjujuy
Usar JQuery con Angular2
- 4 octubre, 2017
- Category : Angular,programacion
3.014K
0
like
Hola buenas a todos, hoy vamos a ver como poder usar JQuery en Angular2.
Siempre, cuando hacemos aplicaciones web, vamos a necesitar del queridisimo JQuery, nos va a facilitar muchas cosas que por ahÃ, TypeScript no nos ayuda.
Una forma de agregar esta libreria a nuestro proyecto es la siguiente:
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script>
Declaramos $ como variable de tipo any
import { Component, Input, OnInit, AfterViewChecked } from '@angular/core';
...
declare var $: any;
y ahora podemos usar JQuery como lo hacemos normalmente:
$('#panel-chat').animate({ scrollTop: $('#panel-chat').prop('scrollHeight') }, 1000);
Como vemos es una forma de integrar estas dos tecnologias.
Otra forma de hacerlo es mediante npm.
1. Instalamos jquery con npm
npm install --save jquery
2. Instalamos el archivo de declaración jQuery para angular
install -D @types/jquery
3. Importamos jQuery
import * as $ from 'jquery';
Y de la misma forma podemos usar nuestro código Jquery sin problemas:
$('#panel-chat').animate({ scrollTop: $('#panel-chat').prop('scrollHeight') }, 1000);
Bueno espero les sea de utilidad, ami me sirvió mucho para algunos proyectos.
Si quieres dejar algun comentario y quieres compartir algo con todos, serán bienvenidos.
Un saludo cordial a todos.
THIS IS AN OPTIONAL
Related Post
Micro Servicios con JHipster, Amplia tus conocimientos en esta tecnologÃa.
Hola como están? continuando con los artÃculos sobre JHipster, vamos a ver como crear micro servic
Un vistazo de App-Shell con Angular 7
Veremos como funciona Angular Shell usando Angular 7 y el rendimiento adicional que obtenemos en nue
Angular – Comunicación entre componentes hermanos (Sibling component communication)
Hola buenas a todos, hoy les comparto un pequeño tutorial para poder comunicar dos componentes herm