Sunday, July 27, 2014

Key points about AngularJS Directive and custom element using Polymer.

Creating custom element is achievable by creating a custom Directive in AngularJS. We can say it's one of the best feature of the framework. As Google's Polymer project is in hype for it's material design and web component based architecture, it also supports functionalities to create a custom component.

To create a directive in AngularJS:

To create a custom web component in Google Polymer:

Once you get a understanding both of these ways to develop a component we may conclude these are main key points to achieve each blocks of custom component:

Functionality In AngularJS In Polymer
Template of a custom element It supports writing template as well as loading template from a URL It supports writing template
Styling template and it's contents In template itself you can add styles and classes In template you can have "<style>" tags to describe different inline styling
Wrapping other HTML by custom component It provides ng-transclude as well as trancluseFunction to achieve this functionality Here it provides insertion point, which tells the browser where to render children
Writing JavaScript logic It can be written inside controller, compile and lining functions. It can be written inside "<script>" tag.

Write comments
  1. The strategy you have posted on this technology helped me to get into the next level and had lot of information in it. The angular js programming language is very popular which are most widely used.
    Angularjs Training in Chennai | Angularjs training Chennai