在Node.js和Express上使用Angular进行客户端路由

Question

I'm using Node & Express on the server side, and Angular on the client side.

But I can't implement Angular Client-Side routing. My Angular router looks like this:

app.config(['$routeProvider', function($routeProvider) {
$routeProvider.
    when('/blogs', {
        templateUrl: 'partials/blogs',
        controller: 'BlogController'
    }).
    when('/news', {
        templateUrl: 'partials/news',
        controller: 'NewsController'
    }).
    otherwise({redirectTo: '/'});
}]);

This is my server routes:

app.use('/',routes.index);
app.use('/partials/:filename',routes.partials);

And my index.js:

exports.partials = function(req, res){
var filename = req.params.filename;
if(!filename) return;
res.render("partials/" + filename );
};

exports.index = function(req, res){
res.render('index');
};

But instead of presenting the partials, I get the index page for every URL

What am I doing wrong?

Answer 1

You have to create a route like this:

router.get('*', function(req, res){
    res.render('layout');
});

In layout.jade you can initialize your routes:

    script(src='https://ajax.googleapis.com/ajax/libs/angularjs/1.4.4/angular.min.js')
    script(src='https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.4.5/angular-route.js')
    script(src='https://ajax.googleapis.com/ajax/libs/angularjs/1.2.7/angular-resource.min.js')
    script(src='/javascripts/app.js')

App.js:

var app = angular.module('app', ["ngRoute"]);

app.config(['$routeProvider', function($routeprovider){
    $routeprovider.
        when('/', {
          template: 'Ok'
        })
}]);