{"repo":"nivekcode/ng-sortgrid","free":true,"listed":false,"github":"https://github.com/nivekcode/ng-sortgrid","clone":"git clone https://github.com/nivekcode/ng-sortgrid.git","description":"🧐 A grid that allows you to sort all items via drag & drop. Items can be sorted in all directions (↕️ and ↔️). You can also select and sort multiple items at the same time by pressing ctrl and click on the item.","language":"TypeScript","stars":148,"topics":["drag-and-drop","sorting","multiselect","angular","hacktoberfest"],"license":"MIT","category":"ui-components","readme_excerpt":"ng-sortgrid - - Table of Contents generated with DocToc - Ng-sortgrid - Getting started - Download - Apply the directive - React on changes - Group sortgrids - Use the async pipe - Style your items on different events - Integrate the build in CSS - Scrolling - Custom scroll points - Scroll speed ( default 50 ) - API - Inputs - Outputs - Mobile usage Download Import the in your . Apply the directive Loop over your elements with ngFor. 🛎️ the items needs to be an array. Alternate you can also use the async pipe to pass in your items. Apply the ngSortgridItem directive React on changes In most cases you are interested in the new sort order. Often you want to store them in local storage or even send them to the backend. To do so the following two steps are needed in addition to the \"Getting started\" step. Pass your items to the directive via the ngSortGridItems input. React on the 'sorted' output event. The sorted output event emits a NgsgOrderChange which contains the previousOrder and the currentOrder Group sortgrids In case you have more than one sortgriditem on the page you need to group the sortgriditems to avoid dropping drags from one group in another group. Pass in a unique name to the ngSortGridGroup input Use the async pipe You can also use the async pipe to display items Style your items on different events The ng-sortgrid adds different classes on different events to your items. You can either use those classes to style the appereance of your items on certain events ","default_branch":null,"files":null,"tree":[],"storefront":"/r/nivekcode","claimed":false,"request_supported":{"post":"https://gitbuyer.com/r/nivekcode/ng-sortgrid/request-supported","requests":0},"note":"indexed from public GitHub; nothing is for sale on this page. Clone it from GitHub. Paid listings live at /search."}