- Create a Controller
- Create an element for Controller binding
- Create a public $scope method
- Display the $scope value in the View
Update the Learn gem so that you're set up for all Angular tests. Run gem update learn-test
in your command line.
Setup the directory structure as follows:
├── js/
│ ├── app/
│ │ ├── controllers/
│ │ ├── app.js
│ ├── angular.js
├── index.html
You can find index.html
and angular.js
in this repo.
Create a new module in js/app/app.js
, named app
.
Create a controller named MainController
inside js/app/controllers/MainController.js
and attach it to a module named app
. The function should take one parameter - $scope
.
Don't forget to initiate our module app
using ng-app
on a HTML element - otherwise we won't see anything!
Initiate our controller MainController
using ng-controller
on a HTML element inside our previous one.
Inside MainController
, assign some values to the $scope
object. You could copy our previous example - create the properties name
, email
and phone
.
Now, we need to display these values inside our HTML. Using {{ }}
(double curlys), display the values you created.