Warning: file_get_contents(/data/phpspider/zhask/data//catemap/3/html/69.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript ExpressJS:将.js文件中的变量调用为index.html_Javascript_Html_Express_Variables_Get - Fatal编程技术网

Javascript ExpressJS:将.js文件中的变量调用为index.html

Javascript ExpressJS:将.js文件中的变量调用为index.html,javascript,html,express,variables,get,Javascript,Html,Express,Variables,Get,我正在使用express@4.16.2 我想调用一个变量,从main.js到index.html main.js: const express = require('express') const app = express() var router = express.Router() app.use('/',express.static('public')); app.get('/main', function(req, res) { res.send("index", {name

我正在使用express@4.16.2

我想调用一个变量,从
main.js
index.html

main.js:

const express = require('express')
const app = express()
var router = express.Router()
app.use('/',express.static('public'));

app.get('/main', function(req, res) {
    res.send("index", {name:'hello'});
});

app.listen(3000, () => console.log('listening on 3000'));
index.html:

<!doctype html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <meta http-equiv="x-ua-compatible" content="ie=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <title></title>
  <link rel="icon" href="images/favicon.png">
</head>

<body>
  <<h1>{{ name }}</h1>
</body>
</html>
是否需要进行http get方法调用?我在两者之间错过了什么?任何帮助/提示/指导都将不胜感激


谢谢

您正在使用hbs语法:

<<h1>{{ name }}</h1>
{
res.render(“index.hbs”{
姓名:“你好”
});
});
app.listen();

您正在使用hbs语法:

<<h1>{{ name }}</h1>
{
res.render(“index.hbs”{
姓名:“你好”
});
});
app.listen();
您必须使用实际值替换视图文件中的变量,并将模板转换为发送给客户端的HTML文件

有许多视图引擎与express结合使用,您可以在此处选择其中一个:

我建议您使用,因为它很容易理解,下面是一个使用它的示例:

main.js

const express = require('express')
const app = express()
var router = express.Router()
app.use('/',express.static('public'));

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

app.get('/main', function(req, res) {
    res.send("index", {name:'hello'});
});

app.listen(3000, () => console.log('listening on 3000'));
index.html

<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="x-ua-compatible" content="ie=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title></title>
<link rel="icon" href="images/favicon.png">
</head>

<body>
<!-- show name -->
<<h1><%= name %></h1>
</body>
</html>

您必须允许用实际值替换视图文件中的变量,并将模板转换为发送给客户端的HTML文件

有许多视图引擎与express结合使用,您可以在此处选择其中一个:

我建议您使用,因为它很容易理解,下面是一个使用它的示例:

main.js

const express = require('express')
const app = express()
var router = express.Router()
app.use('/',express.static('public'));

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

app.get('/main', function(req, res) {
    res.send("index", {name:'hello'});
});

app.listen(3000, () => console.log('listening on 3000'));
index.html

<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="x-ua-compatible" content="ie=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title></title>
<link rel="icon" href="images/favicon.png">
</head>

<body>
<!-- show name -->
<<h1><%= name %></h1>
</body>
</html>


尝试使用:
的可能副本将输出作为:您缺少执行模板操作的插件,您需要自己编写代码或使用类似Try using的库:
的可能副本将输出作为:您缺少执行模板操作的插件,您需要自己编写代码,或者使用这样的库,这给了我一个视图引擎的想法,而我一直缺少它。但是,我从运行中得到的输出是:{{name},只要您得到的是输出{{name}},这就意味着没有任何东西(即视图引擎)实际使用它来替换它。你有没有安装过hbs(或者其他的视图引擎,我只是对hbs个人比较熟悉,但是还有很多其他的)?你发起得对吗?您的文件结构是否符合hbs要求,您是否配置了正确的设置?你发送的app.get是否具有正确的语法和详细信息?这让我了解了我一直缺少的视图引擎。但是,我从运行中得到的输出是:{{name},只要您得到的是输出{{name}},这就意味着没有任何东西(即视图引擎)实际使用它来替换它。你有没有安装过hbs(或者其他的视图引擎,我只是对hbs个人比较熟悉,但是还有很多其他的)?你发起得对吗?您的文件结构是否符合hbs要求,您是否配置了正确的设置?您是否正在发送具有正确语法和详细信息的app.get?