pug变量未在href标记上评估 [英] pug variable not evaluated on a href tag

问题描述

在我的Express JS Web应用程序中， login 路由将一些变量呈现到登录帕格视图.

In my Express JS web app, a login route renders some variables to the login pug view.

在 login.js

router.get('/login', function(req, res, next) {
  var locations = ["Location 1", "Location 2"];
  var count = 0;
  var title = 'Login';
  console.log("req.originalUrl=" + req.originalUrl);

  res.render('login', {
           title: title, // Give a title to our page
           jsonData: locations, // Pass data to the View
           count: locations.length,
           originalUrl: req.originalUrl
      });
});

在 login.pug

extends layout

block content
  div(class='container mt-3')
    h2 Welcome to #{title}, #{count}, #{originalUrl}
    a(class="btn btn-primary" href="/location/new" role="button") NEW
    br
    br
    ul#locList(class='list-group')
      for location in jsonData
        li(class="list-group-item")
          a(href='#{originalUrl}' + '?' + location, class='list-group-item list-group-item-action')
            h2=location

a href 中的 originalUrl 变量未评估为" http://localhost:3000/login?Location％201 "，但改为使用" http://localhost:3000/login#{originalUrl}?Location％201 ".

The originalUrl variable in the a href was not evaluated as 'http://localhost:3000/login?Location%201', but 'http://localhost:3000/login#{originalUrl}?Location%201' instead.

然后我必须将其依次更改为' a(href = originalUrl +'?'+ location，class ='list-group-item list-group-item-action')'使它起作用.

Then I had to change it to 'a(href=originalUrl + '?' + location, class='list-group-item list-group-item-action')' in order to make it work.

简而言之， a(href ='#{originalUrl}')不起作用，而 a(href = originalUrl)起作用，对于 a href.

In a nutshell, a(href='#{originalUrl}') does not work while a(href=originalUrl) works, for a href.

但是，同一变量已在" h2欢迎使用#{title}，#{count}，#{originalUrl} "行中正确地评估为" Welcome Login，2"/login '.

However, the same variable was correctly evaluated at line 'h2 Welcome to #{title}, #{count}, #{originalUrl}' as 'Welcome to Login, 2, /login'.

在 h2 上的 a href 上对同一个变量的求值方式有何不同?

How was the same variable evaluated differently on a href from h2?

推荐答案

这是已知的行为，出现在几个版本之前(我认为是2016年).属性中不支持此#{style} 插值:

This is known behavior that came about a few versions ago (I think 2016). This #{style} interpolation is not supported in attributes:

注意

以前的Pug/Jade版本支持插值语法，例如为:

Previous versions of Pug/Jade supported an interpolation syntax such as:

a(href ="/#{url}")链接不再支持此语法.替代方法如下.(有关更多信息，请参阅我们的迁移指南有关Pug v2与以前版本之间其他不兼容性的信息版本.)

a(href="/#{url}") Link This syntax is no longer supported. Alternatives are found below. (Check our migration guide for more information on other incompatibilities between Pug v2 and previous versions.)

有关更多信息，请参见: https://pugjs.org/language/attributes.html

For more see: https://pugjs.org/language/attributes.html

您应该能够使用常规的模板文字:

You should be able to use regular template literals:

a(href=`${originalUrl}`)

这篇关于pug变量未在href标记上评估的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！