How to develop a simple AngularJS app using NodeJS

How to develop a simple ToDo app using AngularJS and Node.js

Following previous tutorial on developing a responsive website using Node.js and Express Framework, we are going to integrate a simple AngularJS “ToDo” app with our existing project.

Prerequisites

Before continuing with this, make sure you have followed the previous tutorial and have set up your Node.js Project. Or simply download the source from nodeEclipseTutorial and open the project with your favourite Editor.

Node Project Structure

First we need to include the AngularJS in Heading section. From project folder open views -> header.ejs file and replace the content with the following:

Understanding the Controller function

We have a simple function named TodoCtrl() , however we have a special parameter $scope. It is simply used by AngularJS to talk to the ng-model directive in our HTML code.

We can simply pass the $scope into the controller and using an array defined some data (i.e. $scope.todos[]) as well as defining custom functions to handle different functionalities such as updating UI and saving the data to the database.