SlideShare a Scribd company logo

Angular introduction basic

•Download as PPTX, PDF•
•
jagriti srivastava
jagriti srivastava

AngularJS is a JavaScript framework for building browser-based applications that uses a Model-View-Controller pattern. It allows defining custom tags in HTML and uses two-way data binding between models and views. AngularJS applications are cross-browser compliant and use less code than traditional JavaScript apps due to features like dependency injection and built-in services. The framework encapsulates portions of a page into single pages and makes applications easier to test, develop, and maintain.

Related slideshows

Mvc
MvcMvc
Mvc
 
Introduction to ASP.NET MVC
Introduction to ASP.NET MVCIntroduction to ASP.NET MVC
Introduction to ASP.NET MVC
 
Introduction to ASP.NET MVC
Introduction to ASP.NET MVCIntroduction to ASP.NET MVC
Introduction to ASP.NET MVC
 
1 of 8
AngularJS JAGRITI SRIVASTAVA
Angular JS  Javascript framework to build browser based applications  Seems like single page application but loads multiple pages based on user interaction.  Written in javascript with light weight jQuery library called jQuery lite  It encapsulates multiple portion of a page into a single page  It is easy to write test and debug forming a well-defined, well-designed and well-structured web pages.
Why Angular JS  Allows to define custom tags in HTML.  Uses Model View Framework (MVC)  Model  It is the lowest level of the pattern responsible for maintaining data.  View  It is responsible for displaying all or a portion of the data to the user.  Controller  It is a software Code that controls the interactions between the Model and View.  Application written in AngularJS is cross-browser compliant. AngularJS automatically handles JavaScript code suitable for each browser.
Angular as MVC  The view are defined in HTML while model and controller are implemented in javascript.  Model has application data  View is what is visible to the users of our application  Controller acts as the link between the model and view.
MVC Model in Angularjs
Why Angular  Uses less code than traditional Javascript application .  Needs less DOM (Document Object Model) manipulation.  It is easy to test application and develop them using test driven approach .
Core Features  Data-binding-Automatic synchronization of data between model and view components.  Scope − Objects that refer to the model. They act as a glue between controller and view.  Controller − JavaScript functions that are bound to a particular scope.  Services − AngularJS come with several built-in services for example  $https: to make a XMLHttpRequests. These are singleton objects which are instantiated only once in app.  Filters − These select a subset of items from an array and returns a new array.
Core Features  Directives − Markers on DOM elements (such as elements, attributes, css, and more). To create custom HTML tags that serve as new, custom widgets.  AngularJS has built-in directives (ngBind, ngModel...)  Templates − These are the rendered view with information from the controller and model. These can be a single file (like index.html) or multiple views in one page using "partials".  Routing − It is concept of switching views.  Deep Linking − Deep linking allows you to encode the state of application in the URL so that it can be bookmarked. The application can then be restored from the URL to the same state.  Dependency Injection − AngularJS has a built-in dependency injection subsystem that helps the developer by making the application easier to develop, understand, and test.

More Related Content

Angular introduction basic

  • 2. Angular JS  Javascript framework to build browser based applications  Seems like single page application but loads multiple pages based on user interaction.  Written in javascript with light weight jQuery library called jQuery lite  It encapsulates multiple portion of a page into a single page  It is easy to write test and debug forming a well-defined, well-designed and well-structured web pages.
  • 3. Why Angular JS  Allows to define custom tags in HTML.  Uses Model View Framework (MVC)  Model  It is the lowest level of the pattern responsible for maintaining data.  View  It is responsible for displaying all or a portion of the data to the user.  Controller  It is a software Code that controls the interactions between the Model and View.  Application written in AngularJS is cross-browser compliant. AngularJS automatically handles JavaScript code suitable for each browser.
  • 4. Angular as MVC  The view are defined in HTML while model and controller are implemented in javascript.  Model has application data  View is what is visible to the users of our application  Controller acts as the link between the model and view.
  • 5. MVC Model in Angularjs
  • 6. Why Angular  Uses less code than traditional Javascript application .  Needs less DOM (Document Object Model) manipulation.  It is easy to test application and develop them using test driven approach .
  • 7. Core Features  Data-binding-Automatic synchronization of data between model and view components.  Scope − Objects that refer to the model. They act as a glue between controller and view.  Controller − JavaScript functions that are bound to a particular scope.  Services − AngularJS come with several built-in services for example  $https: to make a XMLHttpRequests. These are singleton objects which are instantiated only once in app.  Filters − These select a subset of items from an array and returns a new array.
  • 8. Core Features  Directives − Markers on DOM elements (such as elements, attributes, css, and more). To create custom HTML tags that serve as new, custom widgets.  AngularJS has built-in directives (ngBind, ngModel...)  Templates − These are the rendered view with information from the controller and model. These can be a single file (like index.html) or multiple views in one page using "partials".  Routing − It is concept of switching views.  Deep Linking − Deep linking allows you to encode the state of application in the URL so that it can be bookmarked. The application can then be restored from the URL to the same state.  Dependency Injection − AngularJS has a built-in dependency injection subsystem that helps the developer by making the application easier to develop, understand, and test.