ng-model: Defines the model to be used in AngularJS.

ng-app: Initiates an AngularJS application.

Figure 4: Output of ‘Hello World’ĭirectives are nothing but the markers on a DOM element, which tell the compiler to attach a specified event or behaviour to that element.Īngular comes with a set of built-in directives. The output of the Hello World example is given in Figure 4. Similarly, if the model value is changed, then Angular will change the value of the text box. This is nothing but two-way data binding. So the change in the text box value will automatically reflect in the model yourname. This value is attached with the value of the textbox using the ng-model attribute. As per our code, we have defined a model as yourname. Ng-model and two-way data binding: ng-model binds the model value with the state of the text box.

If you want to activate some specific location, then apply the ng-app attribute to that specific location tag. As per our code, it is the whole document. Ng-app: This attribute stands for the active portion of the entire page.

Figure 3: Core features of AngularJSįirst, all we have to do is include Angular JS JavaScript in our HTML document, as follows: Some of the core features are described in Figure 3. Figure 2: Challenges with SPAsĪngularJS provides solutions to all these challenges. The challenge with building single page applications from scratch is that there are a lot of different issues to deal with, as shown in Figure 2. A single page application is one that has a shell page and contains multiple views in the page.

Create angular js project