This is what makes AngularJS particularly attractive to this author. The W3C Web Component specifications when fully implemented by the major browsers will most certainly cause a major paradigm shift in the way web page construction is viewed.
Building websites and web apps will no longer be seen as a monolithic engineering endeavor. Creating a web app and adding functionality, will become more of a process of adding and extending off-the-shelf UI components represented as HTML markup.
<!-- import html directly into a page --> <link rel="import" href="include.html"> <!-- the new template tag --> <template id="commentTemplate"> <!-- innert DOM --> <style> /* scoped css rules */ </style> <div></div> </template> <!-- extend existing or define new elements --> <element extends="button" name="big-button"> <script> // custom element script API </script> </element> <script> // create a "light weight" iframe var s = element.createShadowRoot(); var t = document.querySelector('#commentTemplate'); r.appendChild(t.content.cloneNode(true)); // all object will have observe() methods to facilitate // model driven views Object.observe(callback); </script>
However, in the snail’s pace of web standards development, full Web Component and MDV support may still be a ways off, but AngularJS directives along with AngularJS data binding (the VM of MVVM) allow us to emulate this type of component encapsulation and functionality now.
What’s even better is that the AngularJS team will actively evolve the framework toward full Web Component and MDV compatibility and usage. UI component code written in AngularJS will likely be quite a bit more forward compatible with evolving web standards than components created using Extjs or jQuery UI. This translates to a longer shelf life and easier upgrade path for the code we write today. What UI developer is ok with their code becoming obsolete after a year or two?