The auto-resize plugin for UI-Grid enables the grid to resize itself when its container changes size.
Note: This plugin works by adding a checker on 250ms interval that sees if the grid element has changed in size. It could potentially affect the performance of your site or application negatively.
You can install @ui-grid/auto-resize via:
npm i --save @ui-grid/auto-resizeOnce you install you need to load our main file bellow your @ui-grid/core file as seen bellow:
<script src="/node_modules/@ui-grid/core/js/ui-grid.core.min.js">
<script src="/node_modules/@ui-grid/auto-resize/js/ui-grid.auto-resize.min.js">Alternatively, if you are using Webpack or RequireJS to load your dependencies, you can do the following at the top of the file that needs it:
require('@ui-grid/core');
require('@ui-grid/auto-resize');Once you load the file, you need to include 'ui.grid.autoResize' module in your angularJS app's dependencies, and add the ui-grid-auto-resize directive to your grid element.
angular.module('myApp', [
'ui.grid',
'ui.grid.autoResize'
]);<div ui-grid="$ctrl.gridOptions" ui-grid-auto-resize>You can find an example of this plugin in action on our website