Rendering lists and using Angular controllers

Angular allows us to interact with our view through code by letting us set a controller for the view. The controller can modify the view scope (the model) and call other operations, such as background services.

In this recipe, we're going to use a controller to write a simple to-do list.

How to do it...

Let's get started.

  1. Create a file named index.html that will display a list of tasks, the form to add a new task, and the button to hide all the tasks:
    <!doctype html> <html ng-app> <head> <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.0.5/angular.min.js"></script> <script src="example.js"></script> </head> <body> <div ng-controller="TodoListController"> <ul> <li ng-repeat="task in tasks" ...

Get HTML5 Data and Services Cookbook now with the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.

Start your free trial