2.1 KiB
| title |
|---|
| AngularJS |
AngularJS
AngularJS (versions 1.x) is an open source front-end JavaScript framework. AngularJS extends HTML to develop rich and powerful front-ends. It reduces the repetitive use of HTML code. This repetition can be avoided by using the directives provided by AngularJS which saves much time and effort. It is cross platform and used to develop Single Page Web Application (SPWA). AngularJS implements the MVC pattern to separate the logic , presentation and data components. It also uses dependency injection to make use of server-side services in client side applications.
AngularJS Expressions
- Expressions can be written inside double braces:
{{ expression }} - Expressions can also be written inside a directive:
ng-bind="expression" - AngularJS will resolve the expression, and return the result exactly where the expression is written
- Expressions are much like JavaScript expressions: They can contain literals, operators, and variables.
Example:
{{ 5 + 5 }} or {{ firstName + " " + lastName }}
Minimal example for usage of AngularJS in an HTML page:
<!doctype html>
<html ng-app>
<head>
<!-- include the AngularJS script -->
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.7.5/angular.min.js"></script>
</head>
<body>
<div>
<label>Your Name:</label>
<input type="text" ng-model="yourName" placeholder="Enter your full name here">
<hr>
<h1>Hello {{yourName}}!</h1>
</div>
</body>
</html>
Install
It is recommended to source the script from Google's CDN (Content Delivery Network) in your deployed, customer facing app whenever possible (better caching, decreased latency, increased parallelism). Please check the latest version on AngularJS.
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.7.5/angular.min.js"></script>
npm:
npm install angular
HTML:
<script src="/node_modules/angular/angular.js"></script>
bower:
bower install angular
HTML:
<script src="/bower_components/angular/angular.js"></script>