singular, Plural and Angular

Starting with Angular

First we will see a simple code to get your name as input and display your name with and without using AngularJs.

What is AngularJS? ( from
AngularJS is a structural framework for dynamic web applications and a complete client-side solution.

ng-stands for angular directive and already built-on with angular.
Here we reference the AngularJS script <strong>script src=””></script></strong>
Add the ng-app directive as <html ng-app> and it is very important directive and it is used to initialize angular app using the above script.
Add the ng-model directive as <input type=”text” ng-model=”name” /> and  ng-model directive is going a add a property called “name” in memory called $scope.
{{ name }} – is data binding expression.

Here ng-model does a magic, two-way data binding,  that is when user updates the data, the property value is updated immediately and vice-versa.(see the example With magic Angular).

What is Directive ? (from

Angular teaches the browser new syntax through a construct we call directives. Examples include:

  • Data binding, as in {{}}.
  • DOM control structures for repeating/hiding DOM fragments.
  • Support for forms and form validation.
  • Attaching new behavior to DOM elements, such as DOM event handling.
  • Grouping of HTML into reusable components.

If you are new to AngularJS, first you should watch Dan Wahlin’s AngularJS Fundamentals in 60-ish Minutes.

You can also view the same contents in pdf format through AngularJS Fundamentals in 60-ish Minutes eBook.