What Are We Making Here, Anyway?
Let's See Some Code
- Wrap everything in the file in a <div> tag and use the ng-app directive to tell the browser that this is an Angular webapp.
- Create a new div for the controller. we set the ng-controller directive to the function for that particular controller.
- We will then put some text on the page instructing the user to "Add a new task here: ," followed by an input box allowing them to enter text. We'll bind that input box's value to the variable newTask using the ng-model directive.
- First, create a function called ToDoListController. This will be called when the <div> from the html file is created. The function automatically accepts the $scope argument (we get this for free from the Angular framework). This is unique to Angular and allows you to access the binded variables from the html file.
- Then we'll set up the variable taskArray and populate it with some dummy data.
- We'll then declare the function add then we need to occur when the Add button is clicked.
- Inside of the add function let's push what's currently in the textbox into our taskArray and set the text input to an empty string.