angular 2 selected libraries

Angular 2 libraries are less numerous than angular 1 equivalents, but they are growing fast. The good point is that you do not loose to much time finding the right one, as it used to be the case with angular 1. And as angular 2 is much clearer, they are generally easier to understand with less code, no dependency to jQuery…

List of angular 2 resources

https://github.com/brillout/awesome-angular-components

Font & icon

  • angular2-fontawesome Font awesome wrapper, make the icon a component or a directive and make font awesome options customisable

https://github.com/travelist/angular2-fontawesome

Layout

  • flex layout api on top of flexbox to automatize flex code and take account of breakpoint … Use directives to styles the page. Is independent of Angular material.

In their flexbox api

There are

  • container directives
  • Child elements in a container directives
  • Special directives (responsive utility…)

Code look like that

div(fxFlex fxLayout='row')
    div(fxFlex="20%")
      p Code
    div(fxFlex="30%")
      p Start Date
    div(fxFlex="30%")
      p End Date
    div(fxFlex="20%")
      p Status

And is then interpreted at run time to adapt to screen size.

Parallax

  • Ang2 parallax

https://github.com/allenRoyston/ang2-parallax

Angular 2 UI components library

We have put our the angular 2 & 4 UI components libraries list in a separate article

Complex stackable grid

Pipes

  • Angular pipes : Shared pipes (filters) libraries. Standard angular pipe are very limited but pipes are very similar project, so a library of pipes makes a lot of sense https://github.com/fknop/angular-pipes

The doc the different available pipes it is available here or there on how to define pipes in your modules and components

  • angular-linky : angular wrapper on a js library that transform in links emails, urls, phone numbers…

https://github.com/dzonatan/angular-linky

  • Angular 2 Mardown Convert markdown to html

Angular 2 markdown make also the auto-linking, you can see all markdown styles in their demo.

https://github.com/dimpu/angular2-markdown

  • Moment date pipes

https://github.com/urish/angular2-moment

Logging

  • ngLogger a logger service for angular : allow to disable loging to group log….

https://github.com/noemi-salaun/ng-logger

Forms

  • credit card validation

https://github.com/nogorilla/angular-cc-library

Data

https://github.com/angular-redux/store

Dynamic component….

  • ng-dynamic One use case is “project” content to a content…dynamically

https://github.com/laco0416/ng-dynamic

Infinite scroll

https://github.com/zefoy/ngx-perfect-scrollbar

Layout

  • Flex layout : Angular team implementation of flexbox

https://github.com/angular/flex-layout

Drag & Drop

Documentation

translation and internationalization

  • ngx-translate : the library for internationalization in angular

https://github.com/ngx-translate/core

Observable

  • Using RXJS n angular

https://auth0.com/blog/making-use-of-rxjs-angular/

  • Hot and cold observable

https://medium.com/@benlesh/hot-vs-cold-observables-f8094ed53339#.pf8m2ewlp

  • Observable and subjects

http://stackoverflow.com/questions/39494058/angular-2-behavior-subject-vs-observable

Debug

  • pretty json A nice json pipes with syntax highlighting

Styling

Table

Charts

Errors

Ng-template

Animation

DOM

https://blog.angularindepth.com/exploring-angular-dom-abstractions-80b3ebcfc02

Utility

  • Generate UUID in the front endhttps://github.com/wulfsolter/angular2-uuid
Written on January 31, 2017