Differences

This shows you the differences between two versions of the page.

Link to this comparison view

angularjs [2014/06/24 15:30]
angularjs [2021/04/05 11:23] (current)
Line 1: Line 1:
 +====== AngularJS ======
 +AngularJS is a Javascript framework developed by Google.
  
 +See [[http://www.angularjs.org | AngularJS]]
 +
 +===== BindOnce =====
 +If large lists (thousands of entries) needs to be displayed and pagination is not an option than the data binding of AngularJS will become a real performance problem because AngularJS creates watches for every binding used.
 +
 +But for data which doesn't change a two-way binding is not necessary. The addon //angular-bindonce// helps by providing a directive for binding just once without creating watches.
 +
 +[[https://github.com/Pasvaz/bindonce | Angular BindOnce]]
 +
 +===== SnapJS =====
 +SnapJS is a Javascript library which implemented a sliding drawer in Javascript, mostly used for side menus.
 +
 +==== Bootstrap Navigation Bar ====
 +The library works out-of-the-box when the drawer goes from top to bottom as in most cases when you have a side menu. But when there is a navigation bar on the top the drawer will place itself under the navigation bar with an  absolut top position of 0, meaning at the top of the browser window. It ignores the positioning of the navigation bar completely.
 +
 +Easiest solution for this is to change the absolute position of the snap drawers to directly under the navigation bar.
 +
 +<sxh css>
 +.snap-drawers {
 +    top: 50px !important;
 +}
 +</sxh>
 +
 +Probably the content of the drawer will be placed above the content, even if the drawer is closed. The z-index needs to be adjusted for that.
 +
 +<sxh css>
 +.snap-drawer-left {
 +    z-index: 0 !important;
 +}
 +</sxh>
 +
 +
 +See [[https://github.com/jakiestfu/Snap.js |SnapJS]]
 +
 +
 +{{tag>devel javascript}}