Tengo instalado el paquete de masonry y sus archivos están en node_modules/masonry_layout
. También tengo instalado jQuery. Necesito utilizar Masonry en un componente.
En mi componente tengo lo siguiente:
import { Component, OnInit } from '@angular/core';
import * as $ from 'jquery';window["$"] = $; window["jQuery"] = $;
@Component({
selector: 'app-galeria',
templateUrl: './galeria.component.html',
styleUrls: ['./galeria.component.min.css']
})
export class GaleriaComponent implements OnInit {
constructor() { }
ngOnInit() {
$(document).ready(function() {
$('.grid').masonry({
itemSelector: '.grid-item',
columnWidth: '.grid-sizer',
percentPosition: true
});
});
}
}
He intentado importar Masonry al componente de las siguientes maneras:
import * as _ from ‘masonry-layout’;
import * from ‘masonry-layout’;
import 'node_modules/masonry-layout/dist/masonry.min.js';
También intenté guardar el masonry.min.js
en mi directorio de assets
y cargarlo directamente en index.html
como un script cualquiera.
<script src="node_modules/masonry-layout/dist/masonry.min.js"></script>
Nada de esto ha funcionado. La consola me dice que la función masonry()
no es una propiedad de jQuery.
¿Saben cómo cargar correctamente este tipo de archivos a los componentes?