使用 node.js 渲染 html

Render html with node.js

本文关键字:html 渲染 js node 使用      更新时间:2023-09-26

我对整个 MEAN 堆栈真的很陌生,正在尝试在 openshift 上创建一个应用程序,但无法呈现新页面。

我只是不断收到此错误,并且无法用我用谷歌搜索的任何内容来解决它。

我的错误:无法在公共目录中查找视图"/register"

在服务器中使用 app.get('/', func()) 渲染索引页完全可以正常工作.js并尝试使用 app.get('/register) 进行完全相同的操作。起初我曾经遇到过同样的问题,但使用 app.use(express.static(__dirname + '/public')解决了它);

索引.html和寄存器.html都位于公共目录中。

这些是我的代码摘录:

索引.html

<body ng-app="">
    <div class="container" ng-controller="LoginController" >
        <h1>Logg in</h1>
        <input class="form-control" placeholder="ID"/>
        <input class="form-control" placeholder="Password"/>
        <button class="btn">Logga in</button>
        <button ng-click="open()" class="btn">Register User</button>
    </div>
</body>

登录控制器

function LoginController($scope, $http) {
console.log("Hello from Login");
    $scope.open = function () {
        console.log('open i login.js');
        $http.get('/register')
    };
};

服务器.js

var express = require('express');
var fs      = require('fs');
var mongojs = require('mongojs');
var jade = require('jade')
var app = express();
var cors = require('cors');
var bodyParser = require('body-parser');
app.use(express.static(__dirname + '/public'));
app.use(express.bodyParser());
app.get('/env',function(req, res){
    res.json(process.env);
});
app.get('/', function (req, res) {
    res.render('/index', {});
});
app.get('/register', function (req, res) {
    res.render('/register');
});
app.set('view engine', 'jade');

有几个问题。

1) 不要对"注册"文件使用斜杠。 这是 /public 文件夹中的文件,而不是文件夹或路由。

app.get('/register', function (req, res) {
    res.render('register');
});

2) 您已将jade设置为渲染引擎。 这意味着您将提供.jade文件。 您的公用文件夹应具有 index.jade 。 它应该看起来像这样:

html
  body(ng-app='')
    .container(ng-controller='LoginController')
      h1 Logg in
      input.form-control(placeholder='ID')
      input.form-control(placeholder='Password')
      button.btn Logga in
      button.btn(ng-click='open()') Register User

几点注意事项:

  • Jade是一个HTML模板引擎,它相对简单,见 http://jade-lang.com/tutorial/。
  • 有一个快速生成器,它将为您提供一个示例应用程序,这是一个很好的起点:http://expressjs.com/en/starter/generator.html
  • 顺便说一下,还有一个 HTML-2-Jade 转换器,我有时发现这很有帮助:http://html2jade.org/