JSPM

angular-float-thead

0.1.2
  • ESM via JSPM
  • ES Module Entrypoint
  • Export Map
  • Keywords
  • License
  • Repository URL
  • TypeScript Types
  • README
  • Created
  • Published
  • Downloads 8431
  • Score
    100M100P100Q135933F
  • License MIT

angular-floatThead is a very simple wrapper around the awesome floatThead library by @mkoryak

Package Exports

  • angular-float-thead

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (angular-float-thead) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

angular-floatThead

angular-floatThead is a very simple wrapper around the awesome floatThead library by @mkoryak

Installation

via bower:

$ bower install angular-float-thead

Usage

  1. This is just a wrapper over the original jQuery floatThead library, so first make sure you have the main library installed as per https://github.com/mkoryak/floatThead

  2. Include angular-float-thead as a dependency for your app after running bower install

angular.module('myApp', ['floatThead'])
  1. Specify float-thead on your table element and optionally pass through a floatThead object as a parameter, eg: <table float-thead="floatTheadOptions">

  2. Add floatTheadOptions to $scope on your controller

$scope.floatTheadOptions = {
    scrollingTop: 60,
    useAbsolutePositioning: false
  };
  1. If you want the directive to reinitialize when your tables data changes then specify an ng-model on your table and it will watch the collection/object and call 'reflow' when the data changes.

for eg:

<table float-thead="floatTheadOptions" ng-model="collectionOrObjectToWatch">

Configuration

You can pass through additional attributes to the directive to modify the behaviour:

float-thead-enabled

Pass through a boolean value or scope object to enable/disable the floatThead library

You can use this to implement a toggle button or to delay the initialization of the library

<table float-thead-enabled="test.enabled" ... >