Question

所以我使用Node.JS作为我的后端和我的servlet for API。我使用AngularJS作为我的前端。

通过Google搜索，我终于解决了使用AngularJS和Node.js ngRoute的问题。结束了这个：

var index = require('./routes/index');
var auth  = require('./routes/auth');

var app = express();

app.set('views', path.join(__dirname, 'views'));

app.use('/api/auth', auth);
app.use('/', index);
app.use('*', index);

这当然是我项目根目录中app.js文件的摘录。

现在，当我打电话给/api/auth/时，我被告知node.js无法找到我的观点。如果我删除app.use('*', index) API再次有效，但是＆＃39; ngRoute＆＃39;不起作用。

我怎样才能达到两者合作的程度？我还想保持地址栏网址尽可能干净。

我的项目是使用yo node调用yeoman启动的，如果这对我的应用程序的文件/文件夹结构有帮助的话。

更新

我没有得到任何答案或评论，所以提供我的完整app.js文件会有所帮助，并帮助我解决这个问题。在这里。

var express = require('express');
var path = require('path');
var favicon = require('serve-favicon');
var logger = require('morgan');
var cookieParser = require('cookie-parser');
var bodyParser = require('body-parser');

var index = require('./routes/index');
var auth = require('./routes/auth');

var app = express();

// view engine setup
app.set('views', path.join(__dirname, 'views'));
app.set('view engine', 'jade');

// uncomment after placing your favicon in /public
//app.use(favicon(path.join(__dirname, 'public', 'favicon.ico')));
app.use(logger('dev'));
app.use(bodyParser.json());
app.use(bodyParser.urlencoded({
    extended: false
}));
app.use(cookieParser());
app.use(express.static(path.join(__dirname, 'public')));

app.use('/api/auth', auth);

app.use('/', index);
app.use('*', index);

// catch 404 and forward to error handler
app.use(function(req, res, next) {
    var err = new Error('Not Found');
    err.status = 404;
    next(err);
});

// error handler
app.use(function(err, req, res, next) {
    // set locals, only providing error in development
    res.locals.message = err.message;
    res.locals.error = req.app.get('env') === 'development' ? err : {};

    // render the error page
    res.status(err.status || 500);
    res.render('error');
});

module.exports = app;

更新2

我注意到声明＆＃34; ngRoute没有工作＆＃34;很模糊如果我删除app.use('*', index)，如果我尝试转到基地址以外的地址，则会收到此错误。 我在尝试访问api/auth

时也收到此错误消息

Error: Failed to lookup view "error" in views directory "/Users/mitch/websites/splatform/views"

更新3

我在app.js中引用的路由所引用的index.js文件也包括此内容。

app.get('/', function(req, res, next) {
    res.sendFile(path.join(__dirname, '../', 'views', 'index.html'));
});

但是，API调用不应该转到index.js文件。应该去Auth.js。

更新4

根据要求，这是来自AngularJS的$routeProvider。

$routeProvider
            .when('/', {
                templateUrl: 'templates/home.html',
                resolve: {
                    lazy: ['$ocLazyLoad', function($ocLazyLoad) {
                        return $ocLazyLoad.load ('frontStyles');
                    }]
                }
            })
            .when('/app/login', {
                templateUrl: 'templates/login.html',
                resolve: {
                    lazy: ['$ocLazyLoad', function($ocLazyLoad) {
                        return $ocLazyLoad.load ('appStyles', 'appScripts');
                    }]
                }
            })
            .when('/app/dashboard', {
                templateUrl: 'templates/dashboard.html',
                resolve: {
                    lazy: ['$ocLazyLoad', function($ocLazyLoad) {
                        return $ocLazyLoad.load ('appStyles', 'appScripts');
                    }]
                }
            })
            .otherwise({ redirectTo: '/' });

        $locationProvider.html5Mode(true);

此处还有一个简单的文件结构

app.js
routes
  --auth.js
  --index.js
views
  --index.html ( angularJS Base )
public
  --directives
  --fonts
  --images
  --javascripts
  --stylesheets
  --templates ( Views that angularjs uses in `ng-view`

Answer 1

先调用api的路由，然后再调用angularjs索引。

例如： routesWeb.js

    'use strict';
    var express = require('express');
    var path = require('path');

    module.exports = function(app) {

        var path_web = path.resolve(__dirname, '..');
        var path_origin = path.resolve(__dirname, '../../');

        app.use('/scripts',express.static(path_web + '/scripts'));
        app.use('/pages',express.static(path_web + '/pages'));
        app.use('/node_modules',express.static(path_origin + '/node_modules'));

        app.route('/*')
        .get(function(req, res){
            res.sendFile(path_web + '/pages/ng-index.html');
        });
    }

pessoaRota.js

'use strict';
module.exports = function(app) {

    var pessoasCtrl = require('../controllers/pessoasController');  

    app.route('/api/pessoas')
        .get(pessoasCtrl.obter_todos_pessoas);

    app.route('/api/pessoas/:pessoaId')
        .get(pessoasCtrl.obter_pessoa_por_id);

    app.route('/api/pessoasFeias')
        .get(pessoasCtrl.obter_pessoas_feias);

};

server.js

var express = require('express');
var app = express();
var port = process.env.PORT || 3000;
var bodyParser = require('body-parser');
var cookieParser = require('cookie-parser');
app.use(bodyParser.json());
app.use(cookieParser());


var server = app.listen(port, function(){
    var host = server.address().address;
    var port = server.address().port;
    console.log("Aplicação está on nesse endereço http://%s:%s", host, port)
});

require('./api/routes/pessoaRota.js')(app);
require('./web/routes/routesWeb.js')(app);

有关更多信息，请访问here。

具有API路由的Node.JS和AngularJS路由

1 个答案: