Install Angularjs: Instructions for Installing Angularjs

Install Angularjs: Instructions for Installing Angularjs is easier to understand when the core ideas are paired with practical examples. The sections below explain the topic clearly, highlight useful steps, and point out details that can prevent common errors.

  src = "https://ajax.googleapis.com/ajax/libs/angularjs/1.3.0-beta.17/angular.min.js" >  ng-app = "ungdungdautien" >  ng-controller = "ViduController" > 

 Chao mung ban den voi {{xinchao.tieude}} taiQTM.com! 

Open an editor, notepad, copy the above code and save it with any name (viduAngularJS.html For instance,), but you must remember that its extension is.html. Next, I present the components in the AngularJS example above.

Cover the AngularJS library

To declare JavaScript in your code, you can declare the following:

  src = "http://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js" > 

This is the first way. This way has included the AngularJS library online (available online, because it is Google's free open library). If you do not want to use this method, you follow the following method.

  src = "D:angular.min.js" > 

Here, I cover the AngularJS library according to the path I just downloaded. Generally both ways are the same. You can try again. (Remember to have a.js tail.)

Point to AngularJS application

The next part is the HTML section containing the AngularJS application. This is added by the ng-app attribute at the root element of HTML in the AngularJS application. You can either add to the html element or in the body element as follows:

  ng-app = "ungdungdautien" > 

View components in AngularJS

View is the following component:

  ng-controller = "ViduController" > 

 Chao mung ban den voi {{xinchao.tieude}} tai QTM.com! 

ng-controller informs AngularJS which controller is used in the view. xinchao.tieude informs AngularJS to write the value of the model with the name xinchao.tieude in the HTML section.

Controller component in AngularJS

Controller is the following part:

The above code registers a controller function with the name ViduController in AngularJS module with the name ungdungdautien . you will learn more about the Modules and Controller Components in the corresponding chapters. The controller function is registered with AngularJS by calling angular.module (.) function. Controller (.).

The $ scope parameter passed to the controller function is a model . The controller function adds a JavaScript object, xinchao , and adds the tieude field to that object.

Execute AngularJS application first

After you save the code under the name viduAngularJS.html and open it under any web browser. You will see the results section as follows:

When the above page is loaded in that browser, the following will happen:

The HTML document will be loaded into the browser, estimated by the browser, AngularJS JavaScript loaded, the global objects of AngularJS are initialized. Then, JavaScript will register the controller function for execution.

Next AngularJS browses HTML elements to test AngularJS applications and views. When the view is found, it connects the view to the corresponding controller feature.