Building Business Components Using Angular
In this course you will learn how to convert two MVC pages to Angular step-by-step.
What you'll learn
Learn how to convert some of your MVC pages to Angular. Doing so can help you speed up your web pages and provide a better user experience. In this course, Building Business Components Using Angular, you're going to learn to convert two MVC web pages to Angular, a credit card page, and an address page. First, you'll learn how to create HTML pages using Angular and how to build and call web API's from Angular. Next, you'll discover how to save and validate data and also will learn about exception handling in Angular. Then, you'll explore how to build custom Angular directives for validation. Finally, you'll learn how to handle server-side validation. By the end of this course, you'll have the tools you need to convert your MVC pages to Angular.
Table of contents
- Create the SPA Project 4m
- Create the index.html Page 2m
- Modify Global.asax to Control Serialization 1m
- Create Angular Module, IndexController, and Routes 4m
- Create Splash Screen and ng-view div Tag 2m
- Building the Credit Card HTML 4m
- Add UI State Object and Message Areas 3m
- Build Credit Card Input Fields 3m
- Add Array Objects to Credit Card Controller 2m
- Load Card Types, Months, and Years 6m
- Bind Input Fields to Controller 2m
- Module Summary 1m
- Build Web APIs for Credit Card Page 4m
- Build Credit Card Types Controller 3m
- Build Month Names Controller 3m
- Build Years Controller 1m
- Build handleException Function 3m
- Call Web API from loadCardTypes Function 3m
- Call Card Types Controller 2m
- Check the Exception Handling 1m
- Create loadYears and loadMonths Functions 4m
- Module and Course Summary 1m
- Introduction to the Address Page 4m
- Build the Address HTML 3m
- Build the Basic Address Controller 2m
- Add Properties and Functions to our Address Controller 3m
- Add Country Drop-down and Mock Data for Countries 3m
- Add Mock Data for US States and Canadian Provinces 2m
- Building Country-specific Address Pages 2m
- Build the UK Address Page 1m
- Build the USA Address Page 2m
- Build the 'Other' Address Page 1m
- Write the countryChanged() Function 5m
- Module Summary 1m
- Overview of Web API Calls for Address Page 4m
- Build Country Web API Controller 2m
- Build US State Codes Web API Controller 1m
- Build Canadian Provinces Web API Controller 2m
- Write the handleException() Function 3m
- Build the loadCountries() Function 4m
- Check the Exception Handling 1m
- Build the loadStates() and loadProvinces() Functions 4m
- Module Summary 1m
- Create the Web API for Saving Addresses 7m
- Save Address Data from Angular 5m
- Common Angular Directives for Client-side Validation 5m
- Add Validation Attributes to All Input Fields 3m
- Add List Items to Display Validation Messages 3m
- Test the Client-side Validation 1m
- Server-side Validation and handleException() Function 3m
- Test the Server-side Validation 4m
- Module Summary and Course Summary 1m
About the author
Paul has over thirty years of experience architecting information systems and his expertise is in much demand from Fortune 500 companies. Paul is a Pluralsight author, has published 400+ articles, and authored over 14 books on topics ranging from JavaScript, Angular, C#, SQL Server and many .NET technologies. Paul is a frequent speaker at conferences and user groups.