Angular js
Download as PPTX, PDF0 likes216 views
AngularJS is a JavaScript framework that extends HTML with directives to bind data to the DOM and make web pages more interactive. It uses MVC architecture with controllers controlling views and models, and services providing reusable code. Templates combine models, controllers and directives to render dynamic views.
Ad
More Related Content
What's hot (20)
Viewers also liked (20)
Ad
Similar to Angular js (20)
Ad
More from Ramakrishna kapa (20)
Recently uploaded (20)
Angular js
- 1. AngularJS is a very powerful JavaScript Framework. It is used in Single Page Application (SPA) projects. It extends HTML DOM with additional attributes and makes it more responsive to user actions. AngularJS is open source, completely free, and used by thousands of developers around the world. It is licensed under the Apache license version 2.0.
- 2. Prerequisites Before you learn AngularJS, you should have a basic understanding of: HTML CSS JavaScript
- 3. AngularJS History AngularJS version 1.0 was released in 2012. Miško Hevery, a Google employee, started to work with AngularJS in 2009. The idea turned out very well, and the project is now officially supported by Google.
- 4. Introduction 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.
- 5. 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.
- 6. AngularJS Applications AngularJS modules define AngularJS applications. AngularJS controllers control AngularJS applications. The ng-app directive defines the application, the ng- controller directive defines the controller.
- 7. Controllers In Angular, a Controller is defined by a JavaScript constructor function that is used to augment the Angular Scope. When a Controller is attached to the DOM via the ng- controller directive, Angular will instantiate a new Controller object, using the specified Controller's constructor function. A new child scope will be created and made available as an injectable parameter to the Controller's constructor function as $scope
- 8. Data Binding Data-binding in Angular apps is the automatic synchronization of data between the model and view components. The way that Angular implements data-binding lets you treat the model as the single-source-of-truth in your application. The view is a projection of the model at all times. When the model changes, the view reflects the change, and vice versa.
- 9. Services Angular services are substitutable objects that are wired together using dependency injection (DI). You can use services to organize and share code across your app. Angular services are: Lazily instantiated – Angular only instantiates a service when an application component depends on it. Singletons – Each component dependent on a service gets a reference to the single instance generated by the service factory. Angular offers several useful services (like $http), but for most applications you'll also want to create your own.
- 10. What are Scopes? Scope is an object that refers to the application model. It is an execution context for expressions. Scopes are arranged in hierarchical structure which mimic the DOM structure of the application. Scopes can watch expressions and propagate events.
- 11. Templates In Angular, templates are written with HTML that contains Angular- specific elements and attributes. Angular combines the template with information from the model and controller to render the dynamic view that a user sees in the browser. These are the types of Angular elements and attributes you can use: Directive — An attribute or element that augments an existing DOM element or represents a reusable DOM component. Markup — The double curly brace notation {{ }} to bind expressions to elements is built-in Angular markup. Filter — Formats data for display. Form controls — Validates user input.
- 12. AngularJS Example <!DOCTYPE html> <html> <script src="http://ajax.googleapis.com/ajax/libs/angularjs /1.4.8/angular.min.js"></script> <body> <div ng-app=""> <p>Name: <input type="text" ng-model="name"></p> <p ng-bind="name"></p> </div> </body> </html>
- 13. output