MEAN Stack CRUD todolist giving infinite list, won't delete

I've been banging my head against this for days and I'm still unsure what's wrong. I'm getting an infinite list of items as soon as I load localhost. These items are usually empty and don't contain anything. And when I try to delete them I get a 404 error that says, 'api/todos/undefined.'

Below is the code. I'm sorry if it's a lot. I just have no idea where the error could be. Maybe it's in the naming? There's also definitely a routing problem.

var mongoose = require('mongoose');

mongoose.connect('mongodb://localhost/');

var Todo = mongoose.model('todos', {
    text : String
});

module.exports.Todo = Todo;

Controller

var baselTodo = angular.module('baselTodo', []);

function mainController($scope, $http) {
    $scope.formData = {text: ''};

    // when landing on the page, get all todos and show them
    $http.get('/api/todos')
        .success(function(data) {
            $scope.todos = data;
        })
        .error(function(data) {
            console.log('Error: ' + data);
        });


    // when submitting the add form, send the text to the node API
    $scope.createTodo = function() {
        $http.post('/api/todos', $scope.formData)
            .success(function(data) {
                $scope.todos = data;
            })
            .error(function(data) {
                console.log('Error: ' + data);
            });
        $http.get('/api/todos').success(function(data) {
            $scope.todos = data;
        })
    };

    // delete a todo after checking it
    $scope.deleteTodo = function(id) {
        $http.delete('/api/todos/' + id)
            .success(function(data) {
                $scope.todos = data;
            })
            .error(function(data) {
                console.log('Error: ' + data);
            });
    };

    {
    $scope.updateTodo = function(id) {
       $scope.newItem = prompt("Please enter your new item: ", "");
        $http.put('/api/todos/' + id, {text: $scope.newItem}).success(function(data) {
                $scope.todos = data;
            });

            $http.get('/api/todos').success(function(data) {
                $scope.todos = data;
            });
    }};




};

html

<body ng-controller="mainController">

<div class="container">
    <div id="person-form">
        <form>

            <div class="form-group">
                <h1>Enter Item:</h1>
                <input type="text" ng-model="formData.text">
            </div>

            <button ng-click="createTodo()">Create</button>

            <h3>Current List:</h3>
            <ul ng-repeat="todo in todos">
                <li> {{todo.text + " || ID: " + todo._id}} </li>
                <button ng-click="updateTodo(todo._id)">Update</button>
                <button ng-click="deleteTodo(todo._id)">Delete</button>
            </ul>

        </form>
    </div>
</div>

</body>
</html>

server

// ================== SERVER.JS ========================

    // set up ------------------------------------------
    var api = require('./routes/api');
    var express = require('express');
    var app = express();    

    // configuration -----------------------------------
    app.configure(function() {
        app.use(express.static(__dirname + '/public'));
        app.use(express.logger('dev'));
        app.use(express.bodyParser());
        app.use(express.methodOverride());
    });

    // listen (start app with node server.js) ----------
    app.listen(3000);
    console.log("App listening on port 3000");

    // routing -----------------------------------------

    // Main Page
    app.get('/', function(req, res) {
        res.sendfile('./public/index.html');
    });

    // API Routing
    app.get('/api/users', api.read);
    app.post('/api/users', api.create);
    app.put('/api/users/:_id', api.update);
    app.delete('/api/users/:_id', api.delete);

Answers


You're missing a semicolon in your server.js file. You want this:

app.put('/api/todos/:_id', api.update);

Add a semicolon to the other one too.


Need Your Help

If (Author) statement in Joomla 1.5

php if-statement joomla

i need php based if loop where i can in Joomla 1.5 HTML insert php code to find author and when i get that variable i can make IF statement

UITextView breaks line automatically if string is shorter than 2 lines

iphone ios objective-c cocoa-touch uitextview

I set up a UITextView that acts strange. If I set it's content to a long text it breaks it correctly at the boundaries however if the content is single lined it automatically breaks it before the l...