Angular js Routes,500内部服务器错误

时间:2014-06-14 10:20:21

标签: javascript node.js angularjs express angular-routing

我有一个像这样的目录结构 -

-project
  -public
     -app
        -app.js ( angular app module )
  -server
     -server.js ( node root js file )   
     -includes 
        -layout.jade
        -scripts.jade
     -views
        -index.jade
        -partials
           -main
              -main.jade
              -about.jade
              -about-vid.jade
              footer_main.jade
           -account
              -login.jade

现在,当我尝试在 one' partials' 目录中使用部分内容时,一切正常,但是当我尝试在单独的目录中组织它们时,我会收到内部服务器错误。这是正常的相关代码 - app.js -

angular.module('app',['ngResource','ngRoute']);

angular.module('app').config(function($routeProvider,$locationProvider){
    $locationProvider.html5Mode(true);
    $routeProvider
        .when('/', { templateUrl: '/partials/main', controller: 'mainCtrl'});
});

server.js代码 -

app.use(express.static(__dirname + '/public'));
app.get('/partials/:partialPath',function(req,res){
    res.render('partials/' + req.params.partialPath);
});

app.get('*',function(req,res){
    console.log(mongoMessage);
    res.render('index');
});

server.jade由server.js呈现 -

include ../includes/layout
.header-white.navbar.navbar-default.navbar-static-top
    .container
        .navbar-header
            button(data-target=".navbar-collapse",data-toggle="collapse",class="navbar-toggle btn navbar-btn")
                span.icon-bar
                span.icon-bar
                span.icon-bar
            a(href="/",class="navbar-brand")
                img(alt="CampuStop",id="logoimg",src="/img/logo_big.png",style="height:74px")
        div(ng-include="'/partials/login'")
block main-content
    div(ng-view)
div(ng-include="'/partials/footer_main'")

include ../includes/scripts

但是如果我尝试组织它们并进行以下更改,我的登录控制台会出现500内部服务器错误, app.js - 将模板网址更改为 / partials / main / main /

angular.module('app').config(function($routeProvider,$locationProvider){
        $locationProvider.html5Mode(true);
        $routeProvider
            .when('/', { templateUrl: '/partials/main/main', controller: 'mainCtrl'});
    });

index.jade - 将包含URL更改为各自的目录:

div(ng-include="'/partials/account/login'")
div(ng-include="'/partials/main/footer_main'")

server.js - 替换:partialParams *

app.get('/partials/*',function(req,res){
        res.render('partials/' + req.params);
    });

任何人都可以告诉我哪里出错或者我应该提供哪些其他信息?

2 个答案:

答案 0 :(得分:1)

当Angular请求模板时,它会设置相对于tempalte文件位置的基本路径。因此,现在从相对于父模板的不同目录调用对partials的任何调用。您需要调整部分路径以解决此问题。

也许是这样的:

div(ng-include="'../partials/account/login'")

你收到500错误,因为Angular找不到部分错误 - 它可能试图获得main/partials/account/login

答案 1 :(得分:1)

我不得不改变

app.get('/partials/*',function(req,res){
        res.render('partials/' + req.params);
    });

到 -

app.get('/partials/*',function(req,res){
        res.render('partials/' + req.params['0']);
    });

当我在控制台中打印req.params时,我发现它返回了一个对象而不是实际创建路由并且不正确地渲染部分的路径