This document provides an overview of Angular JS including its architecture, components like controllers, services, directives and views. It discusses best practices for controllers, creating services, using directives, and avoiding the Flash of Unstyled Content issue. It also mentions the UI-Router module and recommends a file structure for Angular apps. In the end, it lists some pros and cons of Angular JS, noting its two-way binding, component architecture, and rapid development but also potential performance issues with deep object graphs.

1. Angular JS

2. Angular architecture
● Angular component and Use case of it
● Some hands on
● Best practises
● FOCU

3. What is Angular JS?
MVC

4. Angular component
Controller
Service
Factory
Directives
Filter
View

5. Controller
● Setup the scope
● View Interaction
● Coordinate View and Model
● No DOM manipulationangular.module('myApp')
.controller('AddCarCtrl', ['$scope', function($scope) {
//do some stuff
}]);

6. Controller best practice
Less controller code
No application logic
No DOM manipulation

7. Service
Handle non-view logic
Communicate with server
Hold data & status

8. View
Display the Application
Declare Binding & Detectives

9. Create a Service
1. Value
2. Constant
3. Factory
4. Service
5. Providerangular.module('myApp').service('AddCarSvc',function($http,carList) {
//do some stuff
});

10. Directives
DOM manipulation
DOM events
Functionality( ng-show, ng-hide)
Widgets

11. Directives
Link
Controller
Scope

12. Project work though and hand on
https://github.com/dinushadev/angular-training.git
Set up dev environment with browser-sync

13. FOUC
Flash of unstyled Content
1. ng-cloak
[ng:cloak], [ng-cloak], [data-ng-cloak], [x-ng-cloak], .ng-cloak, .x-ng-cloak {
display: none !important;
}
1. ng-bind
Use ng-bind instead of {{ }}
1. Add spinner

14. UI-Router

15. File Structure

16. Pros
● Two way binding
● Component oriented architecture with drectiview
● Rapid development

17. Cons
● Two way binding - formance issue.
● Rerendering
● With deep object graphs can cause slow app

18. Q