jade模板不会使用ui-router动态参数渲染

Question

我使用express 4为角度渲染玉石模板。当我尝试在客户端上使用动态参数进行路由时，我的路线不匹配，因此快递两次发送layout.jade。

app.config(function($stateProvider, $urlRouterProvider, $locationProvider){
    $stateProvider
        .state('home', {
            url: '/',
            templateUrl: 'views/home',
            controller: 'MainCtrl'
        })
        .state('about', {
            // works fine
            url: '/about',
            templateUrl: 'views/about'
        })
        .state('post', {
            url: '/post/{id}',
            // view does not render
            templateUrl: 'views/post',
            controller: 'PostCtrl'
        });

    $urlRouterProvider.otherwise('/');
    $locationProvider.html5Mode(true);
})

当我点击http://localhost:3000/post/0时，请求会发送到与Request URL:http://localhost:3000/post/views/post无关的请求。

我想在点击public/views/post.jade

时呈现/post/{id}

这是快递4路线和配置：

app.set('views', path.join(config.rootPath, '/views'));
app.set('view engine', 'jade')

app.use(bodyParser.json());
app.use(bodyParser.urlencoded({ extended: false }));
app.use(cookieParser());
app.use(express.static(path.join(config.rootPath, 'public')));

app.get('/views/:name', function(req, res){
   res.render('../public/views/' + req.params.name);
})

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

注意 如果我将帖子状态更改为使用模板：

  .state('post', {
        url: '/post/{id}',
        template: '<div>{{ post }}</div> is that',
        controller: 'PostCtrl'
  });

模板将呈现正常。问题是当我使用templateUrl: 'views/post'

时

更新

在主页视图中，我可以导航以查看post.jade：

div(ng-repeat='post in posts track by $index') a(ui-sref='post({ id:{{ $index }} })') Comments

导航到views/post好吧，但如果我刷新页面，我会得到相同的布局布局错误

Answer 1

（我假设config.rootPath是项目的根目录。您应该查看http://nodejs.org/docs/latest/api/globals.html#globals_dirname）

首先，如果您在目录{config.rootPath}/public/views中拥有所有观点，则此行：

app.set('views', path.join(config.rootPath, '/views'));

基本上是告诉Express在{config.rootPath}/views中查找您的玉文件，这不是正确的位置。尝试：

app.set('views', path.join(config.rootPath, 'public', 'views'));

这样，您只需要在渲染玉石文件时指定相对于public/views的路径 - 所以在角度方面，如果您想要在{{1}时渲染public/views/post.jade它只会是：

/post/{id}

在后端，加载视图看起来就像

.state('post', {
    url: '/post/{id}',
    templateUrl: '/post',
    controller: 'PostCtrl'
})

（注意：将param作为路径的基础并不是最好的选择。您希望为部分提供目录app.get('/:name', function(req, res){ res.render(req.params.name); }) ，而不是{{ 1}} - 它会截取几乎所有内容 - 你使用public/views/partials）