Post on 16-Aug-2015
transcript
https://github.com/nirkaufman/angular-webpack-starter
UI-Grid examplehttps://github.com/adamkleingit/3rdParty-uiGrid
http://ui-grid.info/
jsTreehttps://github.com/adamkleingit/3rdParty-jsTree
http://jstree.com
Use an existing wrapping directive?Read at the source code
Look for $watch’es
ng-js-tree — meh… Let’s wrap it ourselves
Plugins use DOM, we want dataUse data services
Transform the data from/to plugin
Bi-directional link from DOM to data
Always destroy the JQuery plugin on $scope.$on(‘$destroy')
Live DEMO in Chrome Inspector
PerformanceTest the plugin on big data sets
Test on the intended devices
Example: Leaflet vs. Google Maps on mobile
Look at the source codeThe library becomes part of your code base
Example: jsTree & depth first search
FlexibilityAre there ways to bypass the impossible?
Example: completely overriding the row/cell template in ui-grid
How easily can you style it?Which classes does it use?
Where are the elements placed?
Does it work a lot with JS calculated dimensions?
Fork → Fix → PR
https://github.com/500tech/ng-grid
https://github.com/500tech/jstree
https://github.com/500tech/ui-layout
https://github.com/500tech/angular-selectize
https://github.com/500tech/angular-google-maps
https://github.com/adamkleingit/god
https://github.com/adamkleingit/acts_as_tree
…
Check the slides:
Read our blog:http://blog.500tech.com
Adam Klein
http://www.slideshare.net/AdamKlein7/3rd-party-50766946
adam@500tech.com