#Intro Angular Lab

The following challenges are designed to introduce you to Angular:

  • Setting up an angular application
  • Rendering data
  • Creating a module
  • Creating controllers
  • Passing values between the controllers and views
  • Two-way data-binding & view-models

Setup

For each challenge, open the corresponding index.html page in your browser. E.g. challenge_1/index.html

On each challenge page, follow the instructions to setup angular. Then move on to the exercises.

You will need to make changes in index.html and app.js.

Keep your Chrome Developer Console open, and make sure you're working in the correct file!

Challenges

  1. Rendering Data in Angular
  2. Using Controllers to hide logic
    • Render data about yourself
  3. Two-Way Data-binding
    • Play with ng-model
    • Create a simple calculator
    • Create a loan interest calculator