AngularJS Application: Part 2

Before reading this article, I highly recommend reading the previous part:

1. AngularJS first Application: Part 1

In the continuity of AngularJS application, we will talk about some more directives and their usage in this article.

In my previous article we discussed some of the very basics of AngularJS. We will move ahead step-by-step.

ng-bind: ng-bind is actually used to bind data to HTML in the very same way as we saw in the previous article by {{ }} (double curly braces). Let's use an example.







In the preceding snapshots we can see how the binding works, so we can use anyone binding to bind the data. Now move ahead and let's see the ng-init directive.

ng-init: ng-init directive is the initialization directive, its main purpose you will learn when we will talk about controllers in detail. Here I am giving an example that shows what and how it works.




In the above snapshots we did use ng-init, here we used some static information with it.

Now one more directive we will use is ng-repeat and we will also see the various types of initialization of the ng-init directive with AngularJS objects (in other words thereby we initialize some values in an object and access those values by that object).



As in the preceding snapshots we can see the highlighted area, where we used ng-init with an object and ng-repeat directive. Which is repeating all the values that is contained by the object.

But notice the order in which they were added to the object and the order they are displayed on the screen. Note it is different. Why is it and how we can sort it out, we will talk about it in our next article. Where we will discuss some more directives, arrays and some events.

Thanks and suggestions are heartily welcome.