Angular2 Grid

Overview:

Angular 2 Grid is a drag/drop/resize grid-based plugin directive for Angular 2. It allows users to easily create dynamic and responsive grids in their Angular applications. The plugin provides a demo to help users get started quickly and includes features for event handling and styling customization.

Features:

• Drag/Drop/Resize: Allows users to drag, drop, and resize grid items within the layout.
• Event Handling: Both the grid and grid items throw events when items are moved or resized.
• Configuration: Easily configure the grid and grid items by adding attributes to elements.
• Styling: Includes basic styling for the grid, items, and placeholders with the option to customize further.
• Demo and Quick Start: Provides a demo for quick setup and a guide on using the Angular 2 Grid system.

Installation:

To install the Angular 2 Grid system, follow these steps:

1. Run npm install angular2-grid in your project directory.
2. Add NgGridModule to your project module imports.
3. Configure the grid by adding [ngGrid] attribute to the container element and [ngGridItem] to each item.
4. Customize styling by including NgGrid.css in your app’s styleUrls property.

Summary:

Angular 2 Grid is a useful plugin for Angular 2 applications that simplifies the creation of dynamic and responsive grids. With features like drag/drop, event handling, easy configuration, and styling options, users can enhance the visual layout of their applications efficiently. By following the installation guide and utilizing the provided demo, developers can quickly integrate this plugin into their Angular projects.