Sort out some common commands in AngularJS, and sort out angularjs commands.

Sort out some common commands in AngularJS, and sort out angularjs commands.

AngularJS commands are used to expand HTML. These are all special attributes starting with the ng-prefix. We will discuss the following commands:

• Ng-app-this command starts an AngularJS application.
• Ng-init-this command initializes application data.
• Ng-model-the model defined by this directive, which is used by variables in AngularJS.
• Ng-repeat-this command repeats the HTML elements of each project in the set.

Ng-app command

The ng-app command starts an AngularJS application. It defines the root element. It automatically initializes or starts applications that load web pages containing AngularJS applications. It is also used to load AngularJS applications of various AngularJS modules. In the following example, the default AngularJS application uses the ng-app attribute of the div element.

<div ng-app="">...</div>

Ng-init command

The ng-init command initializes the data of an AngularJS application. It is used to set the variables used in the application. In the following example, the countries array is initialized. Use the JSON syntax to define the countries array.

<div ng-app="" ng-init="countries=[{locale:'en-US',name:'United States'},                  {locale:'en-GB',name:'United Kingdom'},                  {locale:'en-FR',name:'France'}]">     ...</div>

Ng-model command

The ng-model command defines the model/variable used in AngularJS applications. In the following example, we define a model named "name.

<div ng-app="">...<p>Enter your Name: <input type="text" ng-model="name"></p></div>

Ng-repeat command

The ng-repeat command repeats every item in the html Element Set. In the example below, we have iterated the array countries.

<div ng-app="">...  <p>List of Countries with locale:</p>  <ol>   <li ng-repeat="country in countries">     {{ 'Country: ' + country.name + ', Locale: ' + country.locale }}   </li>  </ol></div>

Example

The following example shows all the preceding commands.
TestAngularJS.html

Output
Open textangularjs.html in the webbrowser. Enter the name and see the following result.