Building Rich Apps with Angular JS on ASP
Building Rich Apps with Angular. JS on ASP. NET www. johnpapa. net
10 ANGULARJS PATTERNS JOHN PAPA TIPS @john_papa
ANGULARJS PATTERNS @john_papa Angular Rocks! Modularity is the bomb! Productivity Thumbs Up for Dependency Injection! Wicked cool! Maybe nobody will notice if I switch to Silverlight OMG, how can I back out of this? Data-binding rocks! Why the heck is it so difficult? ! What? I’m going back to j. Query! Time
ANGULARJS PATTERNS @john_papa https: //github. com/johnpapa/ng-demos http: //jpapa. me/spangz http: //jpapa. me/ng-z-wip https: //github. com/johnpapa/ng-demos
ANGULARJS PATTERNS 1. 2. 3. 4. 5. @john_papa 6. 7. 8. 9. 10.
1
ANGULARJS PATTERNS @john_papa Module Routes View Directives $scope Controller Factories
ANGULARJS PATTERNS @john_papa
ANGULARJS PATTERNS @john_papa
ANGULARJS PATTERNS @john_papa
ANGULARJS PATTERNS @john_papa
ANGULARJS PATTERNS @john_papa
ANGULARJS PATTERNS @john_papa
ANGULARJS PATTERNS @john_papa
ANGULARJS PATTERNS @john_papa
ANGULARJS PATTERNS @john_papa Module Routes View Directives $scope Controller Factories
2
ANGULARJS PATTERNS @john_papa
ANGULARJS PATTERNS @john_papa
ANGULARJS PATTERNS @john_papa
3
ANGULARJS PATTERNS @john_papa Expose functionality
ANGULARJS PATTERNS @john_papa Immediately Identifiable
ANGULARJS PATTERNS http: //jpapa. me/ngstormtmpl @john_papa
4
ANGULARJS PATTERNS @john_papa L I F T http: //jpapa. me/1 i. Vpwkp Locating our code is easy Identify code at a glance Flat structure as long as we can Try to stay DRY
ANGULARJS PATTERNS @john_papa By Type By Feature
ANGULARJS PATTERNS @john_papa Best Advice: Be Consistent! http: //jpapa. me/ngstructure
5
ANGULARJS PATTERNS @john_papa
ANGULARJS PATTERNS @john_papa
ANGULARJS PATTERNS @john_papa
ANGULARJS PATTERNS @john_papa Module Config Filter Directive Factory Service Routes Provider Value Controller
ANGULARJS PATTERNS @john_papa
ANGULARJS PATTERNS @john_papa modular. App avengers dashboard widgets layout common ui-bootstrap core ng. Animate ng. Route
6
ANGULARJS PATTERNS @john_papa View $scope Controller Data Factory $http Web Service
7
ANGULARJS PATTERNS @john_papa
ANGULARJS PATTERNS @john_papa
8
ANGULARJS PATTERNS @john_papa
ANGULARJS PATTERNS @john_papa
ANGULARJS PATTERNS @john_papa
ANGULARJS PATTERNS @john_papa
ANGULARJS PATTERNS Speakers @john_papa Time. Slots Rooms Tracks Sessions
9
ANGULARJS PATTERNS @john_papa
ANGULARJS PATTERNS @john_papa
ANGULARJS PATTERNS @john_papa
ANGULARJS PATTERNS @john_papa
10
ANGULARJS PATTERNS @john_papa
ANGULARJS PATTERNS @john_papa
ANGULARJS PATTERNS @john_papa Local Storage Breeze Import/Export API’s Angular Directives Angular Services
ANGULARJS PATTERNS @john_papa Listen to breeze Broadcast a custom message
ANGULARJS PATTERNS @john_papa Serialize entity, changes and state Stash all WIP
ANGULARJS PATTERNS @john_papa Grab the stashed WIP Return the newly imported entity Import the WIP into Breeze
ANGULARJS PATTERNS @john_papa Update the asterisk WIP directive and counter The WIP data Who tells the directive when WIP changes
ANGULARJS PATTERNS @john_papa
ANGULARJS PATTERNS 1. 2. 3. 4. 5. @john_papa 6. 7. 8. 9. 10.
ANGULARJS PATTERNS @john_papa https: //github. com/johnpapa/ng-demos http: //jpapa. me/spangz http: //jpapa. me/ng-z-wip https: //github. com/johnpapa/ng-demos
ANGULARJS PATTERNS @john_papa http: //pluralsight. com/training/Authors/Details/john-papa
ANGULARJS PATTERNS @john_papa http: //channel 9. msdn. com/Events/Tech. Ed www. microsoft. com/learning http: //microsoft. com/technet http: //microsoft. com/msdn
ANGULARJS PATTERNS @john_papa
ANGULARJS PATTERNS @john_papa
- Slides: 93