Home Angular Angular 6+ Grid Masonry with CSS 3 On Scroll Animation

Angular 6+ Grid Masonry with CSS 3 On Scroll Animation

Angular webcodeflow · June 16, 2022 · Comments off

ng-masonry-grid is an Angular 6+ grid component with CSS animations on hover.

ngx masonry, ng masonry grid, tailwind masonry grid, masonry layout, ngx masonry stackblitz, angular flex layout masonry, masonry grid generator, ionic masonry grid

How to make use of it:

Installation:

First install Peer dependencies
$ npm install masonry-layout imagesloaded --save

To install ng-masonry-grid library, run:
$ npm install ng-masonry-grid --save

You can import the NgMasonryGridModule Module into any Angular AppModule as shown below:

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';

import { AppComponent } from './app.component';

// Import NgMasonryGridModule
import { NgMasonryGridModule } from 'ng-masonry-grid';

@NgModule({
  declarations: [
    AppComponent
  ],
  imports: [
    BrowserModule,

    // Specify NgMasonryGrid library as an import
    NgMasonryGridModule
  ],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule { }

animated masonry grid for angular, ng-masonry-grid Plugin/Github