AngularJS is a JavaScript framework. It can be added to an HTML page with a <script> tag.
AngularJS extends HTML attributes with Directives, and binds data to HTML with Expressions.
AngularJS is a JavaScript framework. It is a library written in JavaScript.
AngularJS is distributed as a JavaScript file, and can be added to a web page with a script tag:
AngularJS extends HTML with ng-directives.
The ng-app directive defines an AngularJS application.
The ng-model directive binds the value of HTML controls (input, select, textarea) to application data.
The ng-bind directive binds application data to the HTML view.
Example explained:
AngularJS starts automatically when the web page has loaded.
The ng-app directive tells AngularJS that the <div> element is the "owner" of an AngularJS application.
The ng-model directive binds the value of the input field to the application variable name.
The ng-bind directive binds the innerHTML of the <p> element to the application variable name.
As you have already seen, AngularJS directives are HTML attributes with an ng prefix.
The ng-init directive initialize AngularJS application variables.
You can use data-ng-, instead of ng-, if you want to make your page HTML5 valid. |
Alternatively with valid HTML5:
You will learn a lot more about directives later in this tutorial.
AngularJS expressions are written inside double braces: {{ expression }}.
AngularJS expressions bind data to HTML the same way as the ng-bind directive.
AngularJS will "output" data exactly where the expression is written.
You will learn more about expressions later in this tutorial.
AngularJS applications are controlled by controllers.
The ng-controller directive defines the controller.
The controller code will execute when the page loads.
You will learn a lot more about controllers later in this tutorial.