Showing posts with label ng-tether. Show all posts
Showing posts with label ng-tether. Show all posts
angular-jl-tether (formerly ng-tether)

angular-jl-tether (formerly ng-tether)

May 17, 2017


Tether for Angular, so you can use it in directives declaratively


Tether wrapper for Angular, so you can use it in directives declaratively. Tether is included
Not to be mistaken for a very cool project called angular-tether that is in the process of implementing Tether in angular.

Install



Using Bower

 bower install jl-tether  

Using NPM

 npm install jl-tether  

Usage


Include jlTether as an angular module dependency, then
 <div jl-tether jl-tether-options="{  
   target: '.target',  
   attachment: 'top left',  
   targetAttachment: 'top right'  
 }"></div>  
or
 <div jl-tether   
  jl-tether-target=".target"   
  jl-tether-attachment="top left"  
  jl-tether-target-attachment="top right"></div>  
You can grab a reference to the Tether object if you want by passing a string into jl-tether.
 <div jl-tether="ngTetherReference"   
  jl-tether-target=".target"   
  jl-tether-attachment="top left"  
  jl-tether-target-attachment="top right"></div>  
ngTetherReference will now be in $scope. You can do things like
 <div ng-click="ngTetherReference.destroy()">kind of a button</div>  
To destroy it.
You can see the Tether docs for a full list of options and api functions.

Building


npm run - deps to get the dependencies
npm run - dist to build
npm run watch - to continuously build

Note: Special thanks to Jeffrey Ling

Contact - jeff.ummu@gmail.com

Disclaimer: The blog is created to share angular directives information to geek, curious Angular Developer.