Question

我在Node-Express-Anuglar应用程序中使用Hogan模板引擎。因为我在Hogan模板中使用了Anguar，所以我改变了Hogan的延迟：

app.js

app.locals.delimiters = '{% %}';
app.set('view engine', 'hjs');

因此我可以像这样显示视图参数（Angular如常见）：

index.hjs

<!DOCTYPE html>
<html data-ng-app="app">
<head>
    <title>{% title %}</title>
</head>
<body ng-controller="TestController">
    From Angular model: {{model.testProperty}}

我在渲染函数中传递参数：

路径目录中的

index.js ：

router.get('/', function(req, res, next) {
  res.render('index', { title: 'Example title' });
});

在这种情况下一切正常，{% title %}解析为Example title，{{model.testProperty}}从我的控制器中解析为正确的值。

在Angular端添加路由时出现问题：

module.config(['$routeProvider', '$locationProvider',
    function ($routeProvider, $locationProvider) {
        $locationProvider.html5Mode({
            enabled: true,
            requireBase: false
        });

        $routeProvider.
            when('/', {
                templateUrl: '../diary/diary.html',
                controller: 'TestController'
            }).
            when('/promoted', {
                templateUrl: '..diary/promoted-diary.html',
                controller: 'PromotedController'
            }).
            otherwise({
                redirectTo: '/'
            });         
    }]
);

因为变量{% title %}呈现为{% title %}（因此未进行评估）。整个角度的东西，例如。 {{ model.testProperty }}就像以前一样工作，因此它可以从控制器中正确地解析为值。

Answer 1

我觉得你在这里错过了一招。如果你研究一些流行的MEAN种子项目，如MEAN.io或MEAN.JS，Express将被用作REST引擎，它在前端渲染，路由，数据绑定中为AngularJS提供API。

所以我建议你从后端发送JSON数据：

router.get('/', function(req, res, next) {
  res.json('index', { title: 'Example title' });
});

使用Angular ngResource来使用您的API中的数据，并且前端有路由器，它将处理视图身份验证和授权，显示逻辑。 AngularJS具有丰富的渲染和双向绑定功能，尝试使用它。如果您需要更详细的答案，请告诉我。

注意：您甚至可以使用纯HTML执行此操作，而无需使用任何模板引擎。为简单实施，请查看here

启用路由时AngularJS无法解析Express render（）中的视图参数

1 个答案: