#ngGridView
An infinite grid view for angular 1.x
##Features:
- support super large data set with smooth scrolling performance
- custom grid cell template
- predictable cell dimension to speed up initial render time
##Usage
Install from npm
npm install @ngfancy/ng-gridview --save
Add as an angular dependency.
import {ngGridView} from '@ngFancy/ng-gridview';
// angular should be available in GLOBAL
angular.module('myApp', [ngGridView])
.controller('MainCtrl', () => {
var $ctrl = this;
var dataList = [];
for(var i = 0; i < 200; i++){
this.dataList.push({
name: `dataIndex${i}`
});
}
this.dataList = dataList;
});
If you are using webpack, require the ng-gridview.scss
. or reference the css in your html
<link rel="stylesheet" href="node_modules/dist/ng-gridview.css">
define your template.
<div ng-controller="MainCtrl">
<ng-gridview list="dataList" row-height="100" column-count="2"></ng-gridview>
</div>
##Contributes
It is welcomed to contributes to this project, before contributing, you should read the Design Spec to learn the goal and the theory of this project.
###Setup development environment
clone the repository, cd into the cloned directory and run npm install
to install the dependencies. The building environment
require a node version > 4 and npm version > 3.
then run npm start
to start the webpack-dev-server at localhost:3000
To build a distribution files, run npm run build
. the build files will located in dist directory.