Downloaded 28 times
![Property Binding ✘ Bind directly to properties on DOM model using [] ✘ Very powerful and convenient](https://image.slidesharecdn.com/angular2-160626131952/75/Angular-2-An-Introduction-18-2048.jpg)
![Binding Parent TO Child via @Input ✘ Means binding data from parent to child ✘ Usually involved two steps: ✗Add property to child and decoarte it with @Input decorator. ✗Bind the parent property to child using [] syntax.](https://image.slidesharecdn.com/angular2-160626131952/75/Angular-2-An-Introduction-25-2048.jpg)
Angular 2 - An Introduction
- 1.
- 2. HELLO! I am HitenPratap Singh You can find me at https://github.com/hitenpratap/ https://hprog99.wordpress.com/ hiten@nexthoughts.com
- 3. Anguar 2 AngularJS2 Itcan be used with JS, TypeScript and DART etc
- 4. Angular 1 toAngular 2 What’s actually changed?
- 5. Angular 1 to2 - What’s changed? ✘ Controllers to Components ✘ Unidirectional data flow ✘ Simplified service model ✘ Easier to understand. Easy learning curve ✘ Template syntax is kinda same ✘ Angular Module ✘ $scope ✘ jqLite/jQuery
- 6. What is Angular2? Why it is so awesome.
- 7. Angular 2 BuildingBlocks
- 8.
- 9. Angular 2 Components ✘Components are directive with template ✘ Angular 2 apps are usually built with Component ✘ No $scope and no more controller ✘ Functions/Properties are bound directly from component
- 10. How to createcomponent? ✘ Create a class ✘ Import the Component decorator ✘ Add Meta-Data like selector, template, directives etc ✘ Export class to be used with other class.
- 11.
- 12. Templates in yourcomponent ✘ Templates contains the HTML code which gets rendered on browser ✘ Can be placed inside @Component or referenced as a separate file
- 13.
- 14. Styling your component ✘Style declared in @Component will only be valid for that component only ✘ Can be added directly or referenced as separate file(s).
- 15. Bind Component ToTemplate What are they?
- 16. Ways to bindcomponent to template ✘ Interpolation Expressions ✘ Property Binding ✘ Event Binding ✘ ngModel
- 17. Interpolated Expressions ✘ Used{{}} to achieve said task ✘ Put expression inside the brackets
- 18. Property Binding ✘ Binddirectly to properties on DOM model using [] ✘ Very powerful and convenient
- 19. Event Binding ✘ Binddirectly to events on DOM model using () ✘ Again power just can’t be described in words
- 20. ngModel ✘ Allows twoway data binding ✘ Follows uni-directional data flow concepts ✘ Demo to be followed
- 21. Child Components What arethey and how to use them?
- 22. Child Components ✘ Existwithin another Component called Parent Component ✘ To make a child component just make it and tell its parent about it. SIMPLE!!!
- 24. Parent To ChildCommunication What is this and how do they accomplish it?
- 25. Binding Parent TOChild via @Input ✘ Means binding data from parent to child ✘ Usually involved two steps: ✗Add property to child and decoarte it with @Input decorator. ✗Bind the parent property to child using [] syntax.
- 27. Child To ParentCommunication What is this and how do they accomplish it?
- 28. Event Emitting and@Output ✘ Child to parent communication is achieved by @Output and Event Emitting together.
- 30. Services In Angular2 How to use them?
- 31. Services ✘ Services arebest to perform CRUD opeartions ✘ Keep main processing part separate from Components.
- 33. THANKS! Any questions? You canfind me at: https://github.com/hitenpratap/ https://hprog99.wordpress.com/ hiten@nexthoughts.com