Welcome to Jack's tutorial on basic AngularJS!

View the page source while looking through this tutorial!

Remember to include the angular.js script at the start of your page

Set the scope of AngularJS applications using the ng-app directive

The below textfield has attribute ng-model="name", its contents are binded to 'name'

While the ng-bind="name" attribute binds the innerHTML of the below p element to 'name'

Name:

Input will show up here


Input will show up here

Can do math and output variables easily: {{ 5 + 5 + testnum }} - {{ name }}


Expressions can be used within element attributes


We've used some directives like ng-init, here are a bunch more

ng-repeat is a really useful directive:

  • {{ x }}

Below is an example of a module. A module holds data for the application

With a module, you can have controllers. Controllers control the data of AngularJS applications

First Name:
Last Name:

Full Name: {{firstName + " " + lastName}}

Using a method from the controller:

Full Name: {{fullName()}}