Better Web Templating with AngularJS 1.0

June 14, 2012

Link copied to clipboard
Author Picture By Miško Hevery, Google AngularJS team

AngularJS lets you write web applications as if you had a smarter browser.  It lets you extend HTML's syntax to express your application's components clearly and succinctly and lets use standard HTML as your template language.  And it automatically synchronizes data from your UI (view) with your JavaScript objects (model) through 2-way data binding.

Today we are announcing the 1.0 release of AngularJS.  We’d like to thank our early adopters, and we’re excited to share it with you who haven’t yet experienced it.

Our goal with AngularJS is to eliminate the guesswork in creating web app structure and take the pain and the boilerplate out of web client apps.  We think we’re there and we’d love for you to take a look.

AngularJS’s core features are:

  • Unobtrusive data binding. AngularJS automatically moves data from the UI to your model and back whenever either of them change.  There are no classes to inherit from, and no wrapper or getter/setter methods to call. Your model can be as simple as a as primitive, native array or as complex as you make it via your custom JavaScript type.

  • HTML as the template. You, your browser, your editors and your other tools already know all about working with HTML.  Why introduce something else?  AngularJS lets you expand HTML’s vocabulary with your own app-specific elements, attributes, and class-types that are fully compatible with the HTML specification.

  • Reusable components -- in HTML! AngularJS gives you the power to extend HTML’s syntax with your own elements, attributes that adds behavior or transforms the DOM.  Want to write <tab>, <calendar>, or <colorpicker> instead of <div><div><div>...?  Want to attach keyboard shortcuts to any element by adding an attribute like key=’ctrl-s’?  You miss the <blink> tag?  All these things and more are possible.

  • Views and Routes. AngularJS lets you switch sub-views in your app with a simple route configuration.  And you get URL deep-linking for free.

  • Tests and Testability. Shipping apps means testing them.  We provide common mocks, we take full advantage of dependency injection, and we encourage MVC structure making it easy to test behavior separate from view. It also comes with an end-to-end scenario runner which eliminates test flakiness by having the runner truly understand application state.

Come and check out our many examples, tutorials, videos and our API docs at  And we’d love to hear your thoughts and questions on Google+ or on our mailing list.

Miško Hevery is a software engineer on the AngularJS team in Mountain View, CA.  Miško focuses on imagining a future where web development is actually simple.

Posted by Ashleigh Rentz, Editor Emerita