AngularJS for .NET Developers in 24 Hours, Sams Teach Yourself

Description

In just 24 sessions of one hour or less, students will be up and running with AngularJS in their Microsoft .NET environment. Using a straightforward, step-by-step approach, each lesson builds on their .NET skills and knowledge, helping them quickly learn the essentials of AngularJS, and use it to streamline any web development project.

The quickest and easiest step-by-step introduction to AngularJS programming for Microsoft .NET development

• Build on your .NET skills to master today’s #1 JavaScript framework for high-speed web application development!
• Covers AngularJS basic and advanced techniques, front end development tools, and integrating AngularJS into both new and existing .NET applications
• The first book to cover using AngularJS with SignalR, the breakthrough .NET technology that gives web apps real-time functionality
• Teaches through practical instructions, realistic (not contrived) examples, Q-and-As, quizzes, exercises, tips, and more

In just 24 sessions of one hour or less, you will be up and running with AngularJS in your Microsoft .NET environment. Using a straightforward, step-by-step approach, each lesson builds on your .NET skills and knowledge, helping you quickly learn the essentials of AngularJS, and use it to streamline any web development project.

Step-by-step instructions carefully walk you through the most common questions, issues, and tasks.

Q&A sections, quizzes, and exercises help you build and test your knowledge.

By The Way notes present interesting pieces of information.

Try it Yourself sidebars offer advice or teach an easier way to do something.

Watch Out! cautions advise you about potential problems and help you steer clear of disaster.

Dennis Sheppard is a Front-End Architect at NextTier Education in Chicago, IL. He has delivered enterprise solutions for the private equity, insurance, healthcare, education, and distribution industries. Christopher Miller is an Architect at West Monroe Partners. He has built solutions for the higher education, private equity, and renewable energy industries. AJ Liptak, is a Senior Consultant at West Monroe Partners specializing in modern web application development. He has delivered transformative solutions for the telecom, healthcare, finance, and distribution industries.

Learn how to…  

• Build AngularJS web apps from scratch, or integrate with existing .NET code
• Organize, reuse, and test JavaScript web application code far more effectively
• Discover key JavaScript design patterns that support AngularJS (and their similarities to C#)
• Use AngularJS modules, controllers, views, data-binding, and event handling
• Implement AngularJS services efficiently
• Work with directives, custom directives, and dependency injection
• Set up AngularJS routing
• Apply best practices for organizing AngularJS applications
• Master sophisticated AngularJS techniques, including filters, advanced patterns, and communication between controllers
• Deploy AngularJS code to the Microsoft Azure cloud
• Unit-test and debug your single page applications
• Integrate AngularJS with .NET Web Forms and .NET MVC
• Build REST APIs in .NET and consume their services in AngularJS
• Combine AngularJS with .NET SignalR to build real-time web apps
• Extend AngularJS development with bower, gulp, and webstorm
• Preview the future of AngularJS: Version 2.0 and beyond

• The quickest and easiest step-by-step introduction to AngularJS programming for Microsoft .NET development
• Builds on a student’s .NET skills to master today’s #1 JavaScript framework for high-speed web application development!
• Covers AngularJS basic and advanced techniques, front end development tools, and integrating AngularJS into both new and
existing .NET applications
• The first book to cover using AngularJS with SignalR, the breakthrough .NET technology that gives web apps real-time functionality
• Teaches through practical instructions, realistic (not contrived) examples, Q-and-As, quizzes, exercises, tips, and more

Dennis Sheppard began his development career more than 20 years ago on an Apple IIe writing BASIC programs that printed “Hello!” an infinite number of times. It wasn’t quite love at first sight, but it was close enough. Several years later, after graduating from Louisiana Tech University with a computer science degree, Dennis got all professional with front-end development using ExtJS and .NET. Since then, he’s worked with a plethora of technologies, including a handful of JavaScript frameworks. He’s quite smitten with AngularJS and the roller coaster ride that is being a front-end developer. Dennis is a
Microsoft Certified Solutions Developer and has delivered enterprise solutions for the private equity, insurance, healthcare, education, and distribution industries. Dennis is now the Front-End Architect at NextTier Education in Chicago, and lives in the suburbs with his wife, two kiddos, and a golden retriever.

Christopher Miller is an Architect in West Monroe Partners’ Technology practice. He received a B.S. with Highest Distinction in computer and information technology from Purdue University and started full-time at West Monroe Partners shortly thereafter. Beginning his career in the private equity space, he helped transform his client’s aging applications into modern web applications with the help of newer UI technologies such as HTML5 and jQuery. He has moved on from investment management applications and is currently working on a Software-as-a-Service solution in the renewable energy space at West Monroe Partners. A Microsoft Certified Solutions Developer in Web Applications, his interests include multi-tenancy, RESTful API development, message-based architecture, Microsoft Azure, and of course, AngularJS and other front-end web technologies. Chris lives with his new wife, Hatlyn, in Chicago’s West Loop neighborhood.

AJ Liptak is a Senior Consultant at West Monroe Partners in the Technology practice, focusing on modern web applications. After earning his degree in computer information systems from Bradley University, he started at West Monroe Partners working in the banking, private equity, and distribution industries. He is a Microsoft Certified Solutions Developer and has recently provided transformative solutions for the telecom and healthcare industries. AJ lives in Chicago’s West Loop neighborhood, where he spends most of his free time riding his bike, trying new restaurants, and exploring cutting-edge technology.&>

Why Does Everything Look So Different? . . . . . . . . . . . . . . . . . . . . . . . . . . . 5

How Is the Code Different? . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 6
Options for Front-End Development . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 8
Why Angular? . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 9
Why Is Angular 1 Still Relevant? . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 10
Summary . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 10
Q&A . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 11
Workshop . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 11
Exercise . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 11

HOUR 2: Presenting JavaScript Patterns . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 13
Five JavaScript Tips and Tricks . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 14
JavaScript Patterns . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 17
Summary . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 26
Q&A . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 26
Workshop . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 27
Exercise . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 27

HOUR 3: Tinkering with Tools for Modern Front-End Development . . . . . . . . . . . 29
The Tool Landscape . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 29
Node . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 30
Package Management . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 30
Summary . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 35
Q&A . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 35
Workshop . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 35
Exercise . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 36

HOUR 4: Mastering Modules . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 37
Angular Modules . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 37
Creating Modules . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 38
Summary . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 40
Q&A . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 40
Workshop . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 40
Exercise . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 40

HOUR 5: Covering Controllers . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 41
Angular Controllers . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 41
$scope . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 42
Controller Inheritance . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 44
What Should and Shouldn’t Go into a Controller . . . . . . . . . . . . . . . . . . . . 45
Best Practices . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 45
Summary . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 47
Q&A . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 47
Workshop . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 47
Exercise . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 47

HOUR 6: Understanding Views, Data Binding, and Event Handling . . . . . . . . . . . 49
Angular Views . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 49
Data Binding . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 50
Two-Way Data Binding with ng-model . . . . . . . . . . . . . . . . . . . . . . . . . . . 53
Data Binding Performance . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 55
Multiple Controllers in a View . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 58
Multiple Templates . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 58
Angular Event Binding . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 59
View Best Practices . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 60
Summary . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 61
Q&A . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 61
Workshop . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 62
Exercise . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 62

HOUR 7: Discovering Services: Part I . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 63
Angular Services . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 63
Service Versus Factory . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 64
Using Services . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 67
Summary . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 69
Q&A . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 69
Workshop . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 70
Exercise . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 70

HOUR 8: Discovering Services: Part II . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 71
Using Services for a DAL . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 71
Promises and $q . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 76
Summary . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 78
Q&A . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 78
Workshop . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 78
Exercise . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 78

HOUR 9: Using Built-In Directives . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 79
Angular Directives . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 79
Built-In Angular Directives . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 81
Summary . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 86
Q&A . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 86
Workshop . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 87
Exercise . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 87

HOUR 10: Conquering Custom Directives . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 89
Why Custom Directives? . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 90
Link Function . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 92
Directive Scope . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 94
Element Versus Attribute . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 101
Summary . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 101
Q&A . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 101
Workshop . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 102
Exercise . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 102

HOUR 11: Depending on Dependency Injection . . . . . . . . . . . . . . . . . . . . . . . 103
Inversion of Control and Dependency Injection . . . . . . . . . . . . . . . . . . . . 103
Dependency Injection in .NET . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 104
Using Angular’s DI . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 106
Summary . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 108
Q&A . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 109
Workshop . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 109
Exercise . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 109

HOUR 12: Rationalizing Routing . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 111
Routing in a Single-Page App . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 111
Setting Up Routing with Angular . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 112
Cleaning Up your URLs with HTML5 Mode . . . . . . . . . . . . . . . . . . . . . . . 117
Executing Code Before a Route Change with a Resolve . . . . . . . . . . . . . . . 118
Summary . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 120
Q&A . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 120
Workshop . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 120
Exercise . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 121

HOUR 13: Actualizing Application Organization . . . . . . . . . . . . . . . . . . . . . . . 123
Angular in a Single File . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 123
Breaking Your Application into Separate Files . . . . . . . . . . . . . . . . . . . . . 124
Organizing Your Application by File Type . . . . . . . . . . . . . . . . . . . . . . . . 126
Organizing Your Application by Feature . . . . . . . . . . . . . . . . . . . . . . . . . 126
Application Pro Tips . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 127
Summary . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 128
Q&A . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 128
Workshop . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 128
Exercise . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 128

HOUR 14: Figuring Out Filters . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 129
Examples of Formatting with Built-In Angular Filters . . . . . . . . . . . . . . . . 129
Create Your Own Angular Filter . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 132
Using a Filter to Search on ng-repeat . . . . . . . . . . . . . . . . . . . . . . . . . . . 143
Summary . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 145
Q&A . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 146
Workshop . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 147
Exercise . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 147

HOUR 15: Approaching Angular Patterns . . . . . . . . . . . . . . . . . . . . . . . . . . . . 149
Design Patterns . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 149
Controller Patterns and Principles . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 150
Service Patterns and Principles . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 151
Angular Architecture Patterns . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 152
Summary . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 153
Q&A . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 153
Workshop . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 153
Exercise . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 154

HOUR 16: Making Components Communicate . . . . . . . . . . . . . . . . . . . . . . . . 155
Communication Between Components . . . . . . . . . . . . . . . . . . . . . . . . . . 155
Calling Directive Functions from a Controller . . . . . . . . . . . . . . . . . . . . . 157
Using $watch to Communicate . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 161
Using Events to Communicate . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 165
Nested Controller Communication . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 169
Summary . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 171
Q&A . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 171
Workshop . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 172
Exercise . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 173

HOUR 17: Demonstrating Deployment . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 175
Automating Deployment Tasks . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 175
Writing Production-Ready Angular Code . . . . . . . . . . . . . . . . . . . . . . . . . 177
Error-Checking Your Angular Code . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 178
Minifying and Concatenating Your Angular Code . . . . . . . . . . . . . . . . . . 181
Deploying Your Angular Code to Microsoft Azure . . . . . . . . . . . . . . . . . . 182
Summary . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 183
Q&A . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 183
Workshop . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 184
Exercise . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 184

HOUR 18: Unraveling Unit Tests . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 185
Unit Testing in Angular . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 185
Karma and Jasmine . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 186
Getting Everything Set Up . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 186
Testing Controllers . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 189
Testing Services . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 191
Testing Directives . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 196
Summary . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 197
Q&A . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 197
Workshop . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 198
Exercise . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 198

HOUR 19: Destroying Debugging . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 199
Debugging Strategies and Tips . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 199
Tools . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 201
Summary . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 222
Q&A . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 222
Workshop . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 223
Exercise . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 223

HOUR 20: Applying Angular to ASP.NET Web Forms . . . . . . . . . . . . . . . . . . . . 225
Strategies for Modernizing Web Applications . . . . . . . . . . . . . . . . . . . . . . 225
Translating Web Forms into Angular . . . . . . . . . . . . . . . . . . . . . . . . . . . 226
Augment Web Forms with Angular . . . . . . . . . . . . . . . . . . . . . . . . . . . . 239
Summary . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 245
Q&A . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 246
Workshop . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 246
Exercise . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 246

HOUR 21: Applying Angular to ASP.NET MVC . . . . . . . . . . . . . . . . . . . . . . . . . 247
Building a Sample ASP.NET MVC App . . . . . . . . . . . . . . . . . . . . . . . . . . 247
Adding Angular to an ASP.NET MVC App . . . . . . . . . . . . . . . . . . . . . . . . 256
Summary . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 262
Q&A . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 263
Workshop . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 263
Exercise . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 264

HOUR 22: Using Angular with ASP.NET Web API . . . . . . . . . . . . . . . . . . . . . . 265
Single-Page Apps with Angular and Web API . . . . . . . . . . . . . . . . . . . . . 265
Creating a Simple Web API . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 266
Consuming the Web API in Angular . . . . . . . . . . . . . . . . . . . . . . . . . . . . 273
Consuming Other APIs with Angular . . . . . . . . . . . . . . . . . . . . . . . . . . . 285
Summary . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 291
Q&A . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 291
Workshop . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 292
Exercise . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 292

HOUR 23: Using Angular with ASP.NET SignalR . . . . . . . . . . . . . . . . . . . . . . . 293
When Should You Use SignalR? . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 293
Configuring SignalR . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 294
Adding SignalR to the OWIN Pipeline . . . . . . . . . . . . . . . . . . . . . . . . . . . 294
Sending SignalR Messages in Your API . . . . . . . . . . . . . . . . . . . . . . . . . . 297
Receiving SignalR Messages in Angular . . . . . . . . . . . . . . . . . . . . . . . . . 299
Summary . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 305
Q&A . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 305
Workshop . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 306
Exercise . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 306

HOUR 24: Focus on the Future . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 307
What’s the Current Status of Angular? . . . . . . . . . . . . . . . . . . . . . . . . . . 307
What’s Changing in Angular 2? . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 308
How Can You Prepare for Angular 2? . . . . . . . . . . . . . . . . . . . . . . . . . . . 309
ES6 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 311
Web Components . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 312
Why the First 23 Hours of This Book Are More Important Than This Last Hour . .  . . 315
Summary . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 316
Q&A . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 316
Workshop . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 316
Exercise . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 317

Index . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 319

Additional information