If you are interested to learn about the AngularJS Form Validation
API stands for Application Programming Interface. API (Application Programming Interface) in AngularJS is a set of global JavaScript functions used for the purpose of carrying out the common tasks such as comparing objects, iterating objects, converting data
AngularJS Global API
The AngularJS Global API is a set of global JavaScript functions for performing common tasks like:
- Comparing objects
- Iterating objects
- Converting data
The Global API functions are accessed using the angular object. Below is a list of some common API functions:
| API | Description |
|---|---|
| angular.lowercase() | Converts a string to lowercase |
| angular.uppercase() | Converts a string to uppercase |
| angular.isString() | Returns true if the reference is a string |
| angular.isNumber() | Returns true if the reference is a number |
angular.lowercase()
Example
<div ng-app="myApp" ng-controller="myCtrl">
<p>{{ x1 }}</p>
<p>{{ x2 }}</p>
</div>
<script>
var app = angular.module('myApp', []);
app.controller('myCtrl', function($scope) {
$scope.x1 = "JOHN";
$scope.x2 = angular.lowercase($scope.x1);
});
</script>angular.uppercase()
Example
<div ng-app="myApp" ng-controller="myCtrl">
<p>{{ x1 }}</p>
<p>{{ x2 }}</p>
</div>
<script>
var app = angular.module('myApp', []);
app.controller('myCtrl', function($scope) {
$scope.x1 = "John";
$scope.x2 = angular.uppercase($scope.x1);
});
</script>angular.isString()
Example
<div ng-app="myApp" ng-controller="myCtrl">
<p>{{ x1 }}</p>
<p>{{ x2 }}</p>
</div>
<script>
var app = angular.module('myApp', []);
app.controller('myCtrl', function($scope) {
$scope.x1 = "JOHN";
$scope.x2 = angular.isString($scope.x1);
});
</script>angular.isNumber()
Example
<div ng-app="myApp" ng-controller="myCtrl">
<p>{{ x1 }}</p>
<p>{{ x2 }}</p>
</div>
<script>
var app = angular.module('myApp', []);
app.controller('myCtrl', function($scope) {
$scope.x1 = "JOHN";
$scope.x2 = angular.isNumber($scope.x1);
});
</script>AngularJS Module
ng (core module)
This module is provided by default and contains core components of AngularJS.
| instructions | This is the main set of instructions you use in your template code to build an AngularJS application. Some examples include ngClick, ngInclude, ngRepeat, etc.? |
| Services/factories | It is the core collection of services that are used within your application’s DI. Some examples include: $compile, $http, $location, etc? |
| filter | The core filters available in ng modules transform template data before it is rendered within directives and expressions. Some examples include filter, date, currency, lowercase, uppercase, etc… |
| Global API | The main global API functions are tied to the Angular object. These core functions are useful for low-level JavaScript operations within your application. Some examples include: angular.copy(), angular.equals(), angular.element(), etc… |
ngroot
Use ngRoute to enable URL routing in your application. The ngRoute module supports URL management via both hashbang and HTML5 pushstate. Include angular-route.js file and set ngRoute as a dependency so that it can work in your application.
| Services/factories | The following services are used for route management: $routeParams is used to access the query string values present in the URL. $route is used to access the details of the route that is currently being accessed. The $routeProvider is used to register routes to the application. |
| instructions | The ngView directive will display the template for the current route within the page. |
nganimate
Use ngAnimate to enable animation features in your application. When ngAnimate is included, various core AngularJS directives will provide animation hooks to your application. Animations are defined using CSS transitions/animations or JavaScript callbacks. Include the angular-animate.js file and set ngAnimate as a dependency so that it can work in your application.
| Services/factories | Use $animate to trigger animation operations in your directive code. |
| CSS-Based Animations | Follow the CSS naming structure of ngAnimate to refer to CSS transition/keyframe animations in AngularJS. Once defined, animation can be triggered by referencing a CSS class within HTML template code. |
| js-based animations | Use module.animation() to register JavaScript animations. Once registered, animation can be triggered by referencing a CSS class within the HTML template code. |
ngAria
Use ngAria to include common accessibility features in instructions and improve the experience for users with disabilities. Include the angular-aria.js file and set ngAria as a dependency for it to work in your application.
| Services | The $aria service contains helper methods for applying ARIA attributes to HTML. $ariaProvider is used to configure ARIA attributes. |
ngresource
Use the ngResource module when querying and posting data to a REST API. Include angular-resource.js file and set ngResource as a dependency so that it can work in your application.
| Services/factories | The $resource service is used to define RESTful objects that communicate with the REST API. |
Include angular-cookies.js file and set ngCookies as a dependency so that it can work in your application.
| Services/factories | The $cookies service is a convenient wrapper for storing simple data within browser cookies. |
ng touch
Use ngTouch when developing for mobile browsers/devices. Include the angular-touch.js file and set ngTouch as a dependency so that it can work in your application.
| Services/factories | The $swipe service is used to register and handle mobile DOM events. |
| instructions | There are various directives available in ngTouch to simulate mobile DOM events. |
ng sanitize
Use ngSanitize to securely parse and manipulate HTML data in your application. Include the angular-sanitize.js file and set ngSanitize as a dependency so that it can work in your application.
| Services/factories | The $sanitize service is used to quickly and easily clean up dangerous HTML code. |
| filter | The Linky Filter is used to convert URLs to HTML links within the provided string. |
ngmock
Use ngMock to inject and mock modules, factories, services and providers within your unit tests. To make it work, include the angular-mocks.js file in your test runner.
| Services/factories | ngMock will extend the behaviour of various core services to become test aware and manageable in a synchronous manner. Some examples include: $timeout, $interval, $log, $httpBackend, etc… |
| Global API | There are many helper functions available to inject and mock modules within the unit test code. Some examples inject(), module(), dump(), etc… |
