Tuesday 22 August 2017

AngularJS Directives

DirectiveDescription
ng-appDefines the root element of an application.
ng-bindBinds the content of an HTML element to application data.
ng-bind-htmlBinds the innerHTML of an HTML element to application data, and also removes dangerous code from the HTML string.
ng-bind-templateSpecifies that the text content should be replaced with a template.
ng-blurSpecifies a behavior on blur events.
ng-changeSpecifies an expression to evaluate when content is being changed by the user.
ng-checkedSpecifies if an element is checked or not.
ng-classSpecifies CSS classes on HTML elements.
ng-class-evenSame as ng-class, but will only take effect on even rows.
ng-class-oddSame as ng-class, but will only take effect on odd rows.
ng-clickSpecifies an expression to evaluate when an element is being clicked.
ng-cloakPrevents flickering when your application is being loaded.
ng-controllerDefines the controller object for an application.
ng-copySpecifies a behavior on copy events.
ng-cspChanges the content security policy.
ng-cutSpecifies a behavior on cut events.
ng-dblclickSpecifies a behavior on double-click events.
ng-disabledSpecifies if an element is disabled or not.
ng-focusSpecifies a behavior on focus events.
ng-formSpecifies an HTML form to inherit controls from.
ng-hideHides or shows HTML elements.
ng-hrefSpecifies a url for the <a> element.
ng-ifRemoves the HTML element if a condition is false.
ng-includeIncludes HTML in an application.
ng-initDefines initial values for an application.
ng-jqSpecifies that the application must use a library, like jQuery.
ng-keydownSpecifies a behavior on keydown events.
ng-keypressSpecifies a behavior on keypress events.
ng-keyupSpecifies a behavior on keyup events.
ng-listConverts text into a list (array).
ng-maxlengthSpecifies the maximum number of characters allowed in the input field.
ng-minlengthSpecifies the minimum number of characters allowed in the input field.
ng-modelBinds the value of HTML controls to application data.
ng-model-optionsSpecifies how updates in the model are done.
ng-mousedownSpecifies a behavior on mousedown events.
ng-mouseenterSpecifies a behavior on mouseenter events.
ng-mouseleaveSpecifies a behavior on mouseleave events.
ng-mousemoveSpecifies a behavior on mousemove events.
ng-mouseoverSpecifies a behavior on mouseover events.
ng-mouseupSpecifies a behavior on mouseup events.
ng-non-bindableSpecifies that no data binding can happen in this element, or its children.
ng-openSpecifies the open attribute of an element.
ng-optionsSpecifies <options> in a <select> list.
ng-pasteSpecifies a behavior on paste events.
ng-pluralizeSpecifies a message to display according to en-us localization rules.
ng-readonlySpecifies the readonly attribute of an element.
ng-repeatDefines a template for each data in a collection.
ng-requiredSpecifies the required attribute of an element.
ng-selectedSpecifies the selected attribute of an element.
ng-showShows or hides HTML elements.
ng-srcSpecifies the src attribute for the <img> element.
ng-srcsetSpecifies the srcset attribute for the <img> element.
ng-styleSpecifies the style attribute for an element.
ng-submitSpecifies expressions to run on onsubmit events.
ng-switchSpecifies a condition that will be used to show/hide child elements.
ng-transcludeSpecifies a point to insert transcluded elements.
ng-valueSpecifies the value of an input element.


AngularJS Directives on HTML Elements

AngularJS modifies the default behavior of some HTML elements.
ElementDescription
aAngularJS modifies the <a> element's default behaviors.
formAngularJS modifies the <form> element's default behaviors.
inputAngularJS modifies the <input> element's default behaviors.
scriptAngularJS modifies the <script> element's default behaviors.
selectAngularJS modifies the <select> element's default behaviors.
textareaAngularJS modifies the <textarea> element's default behaviors.

AngularJS Filters

FilterDescription
currencyFormat a number to a currency format.
dateFormat a date to a specified format.
filterSelect a subset of items from an array.
jsonFormat an object to a JSON string.
limitToLimits an array, or a string, into a specified number of elements/characters.
lowercaseFormat a string to lower case.
numberFormat a number to a string.
orderByOrders an array by an expression.
uppercaseFormat a string to upper case.
Filters are explained in Angular Filters.

AngularJS Validation Properties

  • $dirty
  • $invalid
  • $error
Validation is explained in Angular Validation.

AngularJS Global API

Converting

APIDescription
angular.lowercase()Converts a string to lowercase
angular.uppercase()Converts a string to uppercase
angular.copy()Creates a deep copy of an object or an array
angular.forEach()Executes a function for each element in an object or array

Comparing

APIDescription
angular.isArray()Returns true if the reference is an array
angular.isDate()Returns true if the reference is a date
angular.isDefined()Returns true if the reference is defined
angular.isElement()Returns true if the reference is a DOM element
angular.isFunction()Returns true if the reference is a function
angular.isNumber()Returns true if the reference is a number
angular.isObject()Returns true if the reference is an object
angular.isString()Returns true if the reference is a string
angular.isUndefined()Returns true if the reference is undefined
angular.equals()Returns true if two references are equal

JSON

APIDescription
angular.fromJson()Takes a JSON string and returns an JavaScript object
angular.toJson()Takes a JavaScript object and returns a JSON string

Basic

APIDescription
angular.bootstrap()Starts AngularJS manually
angular.element()Wraps an HTML element as an jQuery element
angular.module()Creates, registers, or retrieves an AngularJS module

The Global API is explained in Angular API.

1 comment: