AngularJS: Up and running
- Mumbai Shroff Publishers & Distributors Pvt. Ltd. 2018
- 282
If you want to get started with AngularJS, either as a side project, an additional tool, or for your main work, this practical guide teaches you how to use this meta-framework step-by-step, from the basics to advanced concepts. By the end of the book, you’ll understand how to develop a large, maintainable, and performant application with AngularJS.
Guided by two engineers who worked on AngularJS at Google, youll learn the components needed to build data-driven applications, using declarative programming and the Modelviewcontroller pattern. Youll also learn how to conduct unit tests on each part of your application.
Learn how to use controllers for moving data to and from views Understand when to use AngularJS services instead of controllers Communicate with the server to store, fetch, and update data asynchronously Know when to use AngularJS filters for converting data and values to different formats Implement single-page applications, using ngRoute to select views and navigation Dive into basic and advanced directives for creating reusable components Write an end-to-end test on a live version of your entire application Use best practices, guidelines, and tools throughout the development cycle
Contents 1. Introducing AngularJS. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 1 Introducing AngularJS 2 What Is MVC (Model-View-Controller)? 2 AngularJS Benefits 3 The AngularJS Philosophy 4 Starting Out with AngularJS 10 What Backend Do I Need? 10 Does My Entire Application Need to Be an AngularJS App? 11 A Basic AngularJS Application 11 AngularJS Hello World 12 Conclusion 13 2. Basic AngularJS Directives and Controllers. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 15 AngularJS Modules 15 Creating Our First Controller 17 Working with and Displaying Arrays 22 More Directives 26 Working with ng-repeat 27 ng-repeat Over an Object 28 Helper Variables in ng-repeat 29 Track by ID 30 ng-repeat Across Multiple HTML Elements 32 Conclusion 34 3. Unit Testing in AngularJS. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 35 Unit Testing: What and Why? 35 Introduction to Karma 37
Karma Plugins 38 Explaining the Karma Config 39 Generating the Karma Config 41 Jasmine: Spec Style of Testing 42 Jasmine Syntax 42 Useful Jasmine Matchers 43 Writing a Unit Test for Our Controller 44 Running the Unit Test 47 Conclusion 48 4. Forms, Inputs, and Services. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 49 Working with ng-model 49 Working with Forms 51 Leverage Data-Binding and Models 52 Form Validation and States 54 Error Handling with Forms 55 Displaying Error Messages 56 Styling Forms and States 58 Nested Forms with ng-form 60 Other Form Controls 62 Textareas 62 Checkboxes 63 Radio Buttons 64 Combo Boxes/Drop-Downs 66 Conclusion 68 5. All About AngularJS Services. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 69 AngularJS Services 69 Why Do We Need AngularJS Services? 70 Services Versus Controllers 72 Dependency Injection in AngularJS 73 Using Built-In AngularJS Services 74 Order of Injection 76 Common AngularJS Services 77 Creating Our Own AngularJS Service 78 Creating a Simple AngularJS Service 78 The Difference Between Factory, Service, and Provider 82 Conclusion 86 6. Server Communication Using $http. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 87 Fetching Data with $http Using GET 87 A Deep Dive into Promises 91
Propagating Success and Error 93 The $q Service 94 Making POST Requests with $http 94 $http API 96 Configuration 97 Advanced $http 99 Configuring $http Defaults 99 Interceptors 101 Best Practices 104 Conclusion 106 7. Unit Testing Services and XHRs. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 107 Dependency Injection in Our Unit Tests 107 State Across Unit Tests 109 Mocking Out Services 111 Spies 113 Unit Testing Server Calls 115 Integration-Level Unit Tests 118 Conclusion 120 8. Working with Filters. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 121 What Are AngularJS Filters? 121 Using AngularJS Filters 122 Common AngularJS Filters 124 Using Filters in Controllers and Services 130 Creating AngularJS Filters 131 Things to Remember About Filters 133 Conclusion 134 9. Unit Testing Filters. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 135 The Filter Under Test 135 Testing the timeAgo Filter 136 Conclusion 138 10. Routing Using ngRoute. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 139 Routing in a Single-Page Application 140 Using ngRoute 141 Routing Options 143 Using Resolves for Pre-Route Checks 146 Using the $routeParams Service 148 Things to Watch Out For 149 A Full AngularJS Routing Example 150