Post
Ask Question

Getting Started With Angular.js

Before starting to write the code, let us first understand Angular.js.

Angular.js

This is a library like jQuery. A Single Page Application (SPA) is one in which we have a shell page and we can load multiple views into that. In a SPA we can load the initial content upfront and then the various views or the little kind of mini-web pages can be loaded on the fly and embedded into the shell.

It is based on,

  • Directives
  • Data Binding Expressions

Use the following procedure to write the code with Angular.js.

Step 1. Create an empty ASP.NET website named "Angular_JS".

Create a empty AspNet website

Step 2. Add a page of HTML into it named "Example1".

Add a page

Step 3. Download Angular.js from the link Angularjs and save it to your website.

Download the Angular

Note. I am using Angular.min.js on this website.

Step 4. After adding the Angular.js to the website, write the script tag that will access the Angular file.

Angular file

Step 5. Now write the code using Directives and Data binding expressions on the page.

  • Write the ng-app directive in the <html> tag, which is necessary to initialize the Angular app. 
    <html ng-app xmlns="http://www.w3.org/1999/xhtml"></html>
  • Write a TextBox into the body tag with the ng-model="name" directive, that will add a property in the memory called "name" like. 
    <input id="Text1" type="text" ng-model="name" />
  • In the end, write a Data Binding Expression of the property named "name" within the brackets syntax like {{property name}} and here the property name is "name" so it will be written like. 
    {{name}}

Data Binding Expression

Step 6. Run the page.

Run the page

Now when you type any text in the TextBox, it will automatically show after the string "Hi, you are typing" like.

Textbox

Great; you have now done it successfully.


Similar Articles