Understanding AngularJs: Scope, Filters, Directives, Events in HTML implementation

  • AngularJS is an open source JavaScript framework that allows to move the presentation logic on the client side and thus separate it from the logic of the application that remains on the server.
  • Start your First HTML page with AngularJS

    AngularJS is distributed as a JavaScript file, and can be added to a web page with a script tag:

    Data-binding is an automatic way of updating the view whenever the model changes, as well as updating the model whenever the view changes.

  • AngularJS controller is defined with ng-controller directive.
  • AngularJS controller is a JavaScript object containing attributes/properties and functions.
  • AngularJS directives are extended HTML attributes with the prefix ng-.

AngularJS Scope The scope is the binding part between the HTML (view) and the JavaScript (controller). It …

@QueryHome: Understanding AngularJs: Scope, Filters, Directives, Events in HTML implementation #angularjs #css

AngularJS is an open source JavaScript framework that allows to move the presentation logic on the client side and thus separate it from the logic of the application that remains on the server. AngularJS aims to minimize this complexity by offering a great environment for development, as well as the means to test your apps. 

Start your First HTML page with AngularJS

AngularJS is distributed as a JavaScript file, and can be added to a web page with a script tag:

Data-binding is an automatic way of updating the view whenever the model changes, as well as updating the model whenever the view changes. 

AngularJS controller to control the flow of data in the application. AngularJS controller is defined with ng-controller directive. AngularJS controller is a JavaScript object containing attributes/properties and functions. 

Output

Separating Controller and Module files

AngularJS directives are extended HTML attributes with the prefix ng-.

ng-repeat − This directive repeats html elements for each item in a collection.

Output

Directives in AngularJS are prefixed with ‘ng-‘. Basically, these directives are included in the HTML elements or tags, like an attribute. By using these ng-directives as attributes of HTML elements, we can provide a special feature to the particular HTML element.

Directives behave as markers on the HTML DOM element attributes. Directives speak to the HTML Compiler of AngularJS to attach a specified behavior. $Compile is the one which compiles the Angular code from the DOM. The custom directives are used to create our own directives.

The ng-app directive defines the root element of an AngularJS application.

The ng-app directive will auto-bootstrap (automatically initialize) the application when a web page is loaded.

AngularJS comes with a set of these directives built-in, like ngBind, ngModel, and ngClass. Much like you create controllers and services, you can create your own directives for AngularJS to use. When AngularJS bootstraps your application, the HTML compiler traverses the DOM matching directives against the DOM elements.

Creating a custom directive

var app = angular.module( ‘Customers’ , [])  

app.controller(‘CustomerDetails’ ,  function ($scope) {  

  app.directive(‘customInfo’ ,  function () {  

Understanding AngularJs: Scope, Filters, Directives, Events in HTML implementation

You might also like More from author

Comments are closed, but trackbacks and pingbacks are open.