Preface. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . vii
1. Introduction to AngularJS. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 1
Concepts 1
Client-Side Templates 2
Model View Controller (MVC) 3
Data Binding 3
Dependency Injection 5
Directives 5
An Example: Shopping Cart 6
Up Next 9
2. Anatomy of an AngularJS Application. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 11
Invoking Angular 11
Loading the Script 11
Declaring Angular’s Boundaries with ng-app 12
Model View Controller 12
Templates and Data Binding 14
Displaying Text 15
Form Inputs 16
A Few Words on Unobtrusive JavaScript 19
Lists, Tables, and Other Repeated Elements 21
Hiding and Showing 23
CSS Classes and Styles 24
Considerations for src and href Attributes 26
Expressions 26
Separating UI Responsibilities with Controllers 27
Publishing Model Data with Scopes 28
Observing Model Changes with $watch 29
Performance Considerations in watch() 31
Organizing Dependencies with Modules 33
How Many Modules Do I Need? 36
Formatting Data with Filters 37
Changing Views with Routes and $location 38
index.html 39
list.html 39
detail.html 40
controllers.js 40
Talking to Servers 41
Changing the DOM with Directives 43
index.html 44
controllers.js 44
Validating User Input 45
Moving On 46
3. Developing in AngularJS. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 47
Project Organization 47
Tools 50
IDEs 50
Running Your Application 51
With Yeoman 51
Without Yeoman 51
Testing with AngularJS 52
Karma 52
Unit Tests 54
End-to-End/Integration Tests 55
Compilation 57
Other Awesome Tools 59
Debugging 59
Batarang 60
Yeoman: Optimizing Your Workflow 64
Installing Yeoman 65
Starting a Fresh AngularJS project 65
Running Your Server 65
Adding New Routes, Views, and Controllers 65
The Testing Story 66
Building Your Project 66
Integrating AngularJS with RequireJS 67
4. Analyzing an AngularJS App. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 77
The Application 77
Relationship Between Model, Controller, and Template 78
The Model 79
Controllers, Directives, and Services, Oh My! 80
Services 80
Directives 84
Controllers 85
The Templates 89
The Tests 95
Unit Tests 96
Scenario Tests 99
5. Communicating with Servers. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 101
Communicating Over $http 101
Configuring Your Request Further 103
Setting HTTP Headers 104
Caching Responses 105
Transformations on Requests and Responses 106
Unit Testing 107
Working with RESTful Resources 108
The Declaration 111
Custom Methods 111
No Callbacks! (Unless You Really Want Them) 112
Simplified Server-Side Operations 112
Unit Test the ngResource 112
The $q and the Promise 113
Response Interception 115
Security Considerations 115
JSON Vulnerability 116
XSRF 116
6. Directives. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 119
Directives and HTML Validation 119
API Overview 120
Naming Your Directive 121
The Directive Definition Object 122
Transclusion 126
Compile and Link Functions 126
Scopes 128
Manipulating DOM Elements 132
Controllers 133
Moving On 136
7. Other Concerns. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 137
$location 137
HTML5 Mode and Hashbang Mode 140
AngularJS Module Methods 142
Where’s the Main Method? 142
Loading and Dependencies 143
Convenience Methods 144
Communicating Between Scopes with $on, $emit, and $broadcast 146
Cookies 148
Internationalization and Localization 148
What Can I Do in AngularJS? 149
How Do I Get It All Working? 149
Common Gotchas 150
Sanitizing HTML & the Sanitize Module 150
Linky 152
8. Cheatsheet and Recipes. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 153
Wrapping a jQuery Datepicker 153
ng-model 155
Binding select 155
Calling select 155
The Rest of the Example 156
The Teams List App: Filtering and Controller Communication 157
The Search Box 161
The Combo Boxes 161
The Check Box 161
The Repeater 161
File Upload in AngularJS 162
Using Socket.IO 164
A Simple Pagination Service 167
Working with Servers and Login 171
Conclusion 174
Index. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 177
- Log in to post comments