Next, we will add an Angular module and controller to the
The Angular module is the gathering point of many different Angular systems. A module pulls all of those components together in to a single place.
The Angular controller is one of those pieces. It defines custom functions and variables which are used inside of a particular scope.
In this simple application, we will use a single controller and a single scope for the entire tutorial. When your application becomes more complex, with multiple screens, you may choose to separate the different sections in to different controllers, and if it is big enough you may choose to have different modules for different sections. Angular allows you to divide this up, so that a variable, a function, or another Angular component used on one screen does not appear everywhere else. And, if you have a large application, with hundreds of variables, this makes keeping track of everything much easier.
Add the following code to the bottom of your
$scope.productList = testData;
What does this do? In our application, we have defined a controller. Then, we have asked Angular to give us access to the
$scope, which is the set of variables and functions available to our application. Finally, we have attached our
testdata to the
$scope, which makes the test data visible to the local application.