Single Page Application (SPA)
The Challenge with SPAs
![](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh-MHNd1eK6LGyXTC5hweVHzpT2jKIgljIW9Ppx267fqpKTzzPvAsy8W153m2_RixecfRJAgRfqq0NOl6oi-RncTy4fIO5EZTbp8OS9Jwxdw430YZHNAyYFOZJcBG1hhpkn8IOez4uXbX-n/s640/image2.png)
![](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEguyY_jbIzr9EHxCgbEfHuz1svFb-zszROqP48oOAQxTB92c7ZEJreRhVwmoHiDdE8WZgSyw_mbBcupRzMNzGuXy4jY1etykNPZHVivWyz8jF_kVjVNgTWe7SftwclItoJpddGhmoman15z/s640/image3.png)
![](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiXSfp1fVVfO2Fyl_iOiEZwJ4D9DsYrqUvZrLPAMPBFb-mTAc5kWgMdPxij_r4GLUobuzm_U6ADwAXvedeZ9fC2FpSVNupYv-lK4xrBGzLPAWUVyKaJAk_P4NcfVnszx0UcN3KnPZMRXYDI/s640/spa.png)
The Challenge with SPAs
![](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh-MHNd1eK6LGyXTC5hweVHzpT2jKIgljIW9Ppx267fqpKTzzPvAsy8W153m2_RixecfRJAgRfqq0NOl6oi-RncTy4fIO5EZTbp8OS9Jwxdw430YZHNAyYFOZJcBG1hhpkn8IOez4uXbX-n/s640/image2.png)
![](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEguyY_jbIzr9EHxCgbEfHuz1svFb-zszROqP48oOAQxTB92c7ZEJreRhVwmoHiDdE8WZgSyw_mbBcupRzMNzGuXy4jY1etykNPZHVivWyz8jF_kVjVNgTWe7SftwclItoJpddGhmoman15z/s640/image3.png)
Directives, Filters and Data Binding
What are Directives?
Using
Filters
Views, Controllers and
Scope
Creating a View and Controller
Modules are Containers
![](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjEvEnYiD8_gj1hbuS_k5okP0PhgV__Cca_NxsQ0MTVGlmEuBh3cVmEXuExSrFEqEW7bceZ6lHCgbLaPRct08jqup2CQcgHBjOGhGr2JeUxvOKcyg-VugwtCcmp529ld2KeJOz7gT3r-scn/s640/image10.png)
Creating a Module
![](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg0lWo7rcMa3r1ujkNml68Y27HeANdflqFXAvBP1bZCImM62WJpcBLYJRxWqC8HM9XKFSTo4PTWLDEzgK9OUaqS6bWU9NJ1BaFw0Po-yOTGuXrLK3e-Yjf14famZ8uY5auREtO-Pfttp1_G/s640/image11.png)
Creating a Controller in a Module
![](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgeOr19W2_Ukqbx1MAhuwGMZivwr41ZFAgp2XW82Nc15KWTyMcSOvc9tcKIfPK5zZIo34ksTU5Ccw-6h1mlq_QULG011riX5IMZe9I08B_l8ujVCfI9BymiFtponFDyRHL08V_O38Sf8hZG/s640/image12.png)
The Role of Routes
![](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEilXGMTkA5ERLpR_ohEhzyvyG83A7NdPDMaXFW0EJgnNBcZzLiEBb57PUObIN2SQJq8XZnmIO9S6RgO-4rP3UI9waYwdPMUDsU3VsqPsj87JUARIgZdr4-n3iz4itptebKuOpJwPgJ907Ty/s640/Image13.png)
Defining Routes
![](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgTTQsSu61OQeMgWDvPmob7_KT11kIUXrXlBt98ymyYdTghyfW3tAeM4GEaJxS2xnQnkvHZzivD1gfuj01xsp4txm6WZIRXpK6W2F9aQ1foPKA5KFJ12F4Psg1RFLW_rJ1OPhecd0cmm7nX/s640/image14.png)
Where do Views Go in a Page?
![](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjEvEnYiD8_gj1hbuS_k5okP0PhgV__Cca_NxsQ0MTVGlmEuBh3cVmEXuExSrFEqEW7bceZ6lHCgbLaPRct08jqup2CQcgHBjOGhGr2JeUxvOKcyg-VugwtCcmp529ld2KeJOz7gT3r-scn/s640/image10.png)
Creating a Module
![](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg0lWo7rcMa3r1ujkNml68Y27HeANdflqFXAvBP1bZCImM62WJpcBLYJRxWqC8HM9XKFSTo4PTWLDEzgK9OUaqS6bWU9NJ1BaFw0Po-yOTGuXrLK3e-Yjf14famZ8uY5auREtO-Pfttp1_G/s640/image11.png)
Creating a Controller in a Module
![](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgeOr19W2_Ukqbx1MAhuwGMZivwr41ZFAgp2XW82Nc15KWTyMcSOvc9tcKIfPK5zZIo34ksTU5Ccw-6h1mlq_QULG011riX5IMZe9I08B_l8ujVCfI9BymiFtponFDyRHL08V_O38Sf8hZG/s640/image12.png)
The Role of Routes
![](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEilXGMTkA5ERLpR_ohEhzyvyG83A7NdPDMaXFW0EJgnNBcZzLiEBb57PUObIN2SQJq8XZnmIO9S6RgO-4rP3UI9waYwdPMUDsU3VsqPsj87JUARIgZdr4-n3iz4itptebKuOpJwPgJ907Ty/s640/Image13.png)
Defining Routes
![](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgTTQsSu61OQeMgWDvPmob7_KT11kIUXrXlBt98ymyYdTghyfW3tAeM4GEaJxS2xnQnkvHZzivD1gfuj01xsp4txm6WZIRXpK6W2F9aQ1foPKA5KFJ12F4Psg1RFLW_rJ1OPhecd0cmm7nX/s640/image14.png)
Where do Views Go in a Page?
Dynamically loaded views are
injected into the shell page as a module loads:
The Role of Factories
Summary
•AngularJS provides a robust "SPA" framework for building robust
client-centric applications
•Key
features:
–Directives and filters
–Two-way data binding
–Views, Controllers, Scope
–Modules and Routes