Angular with Node

Question

So Im trying to work AngularJS and Node. I am trying to set up client side routing but Im having some problems.

EDIT

So I changed up some code following https://github.com/scotch-io/starter-node-angular that @PareshGami suggested. I get the URLS to be hit but now the actual content doesnt load.

Here is my updated Code:

server.js:

var express = require('express'),
    app = express(),
    bodyParser = require('body-parser'),
    mongoose = require('mongoose');




app.use(bodyParser.json());


require('./server/routes')(app);

app.use('/js', express.static(__dirname + '/client/js'));
app.use('/views', express.static(__dirname + '/client/views'));
app.use('/bower_components', express.static(__dirname + '/bower_components'));
app.use('/node_modules', express.static(__dirname +'/node_modules'));



app.listen(3000);
console.log('Im Listening...');
exports = module.exports = app;

my angular app.js:

(function (angular) {
    'use strict';
    var app = angular.module('eos', [
        'ngRoute',
        'ngResource',
        'eos.opsCtrl',
        'eos.dashboardCtrl'
        ]);

    app.config(function ($routeProvider, $locationProvider){
        $routeProvider.when(
           '/',
           {
               templateUrl: 'views/dashboard.html',
               pageName: 'Dashboard',
               controller: 'dashboardCtrl'
           }
       );
        $routeProvider.when(
           '/ops',
            {
                templateUrl: 'views/ops.html',
                pageName: 'Operations',
                controller: 'opsCtrl'
            }
        );
        $routeProvider.otherwise({redirectTo: '/'});
        $locationProvider.html5Mode(true);

    });

}(window.angular));

My routes.js (new):

var opsController = require('./controllers/opsController');

module.exports = function(app) {
//path.join(__dirname, 'client');
    // server routes ===========================================================
    // handle things like api calls
    // authentication routes

    app.get('/api/ops', opsController.list);
    app.post('/api/ops', opsController.create);


    // frontend routes =========================================================
    // route to handle all angular requests
    app.get('*', function(req, res) {
        res.sendFile('index.html', { root: './client' });
    });

};

Then rest is identical. And suggestions on why it is not loading the content in the ng-view?

---

FINALLY GOT IT TO WORK! My server.js was set up wrong.

Here is the correct server.js. Notice position of:

require('./server/routes')(app);

it needed to be father down for what I assume is the compile sequence

var express = require('express'),
    app = express(),
    bodyParser = require('body-parser'),
    mongoose = require('mongoose'),
    methodOverride = require('method-override');





// get all data/stuff of the body (POST) parameters
app.use(bodyParser.json());
// parse application/vnd.api+json as json
app.use(bodyParser.json({ type: 'application/vnd.api+json' }));
// parse application/x-www-form-urlencoded
app.use(bodyParser.urlencoded({ extended: true }));




app.use(methodOverride('X-HTTP-Method-Override'));
app.use('/js', express.static(__dirname + '/client/js'));
app.use('/views', express.static(__dirname + '/client/views'));
app.use('/bower_components', express.static(__dirname + '/bower_components'));
app.use('/node_modules', express.static(__dirname +'/node_modules'));


require('./server/routes')(app);
app.listen(3000);
console.log('Im Listening...');
exports = module.exports = app;

Answer 1

I was directed by PareshGami to look over this site 'setting-up-a-mean-stack-single-page-application'. After following that I was able to get the routing to work. The key to my problem was the ordering of my server.js file and the require('./server/routes')(app); part.