节点Mustache:如何在单独的单选按钮上获取数组的每个值

Node Mustache: How to get each value of an Array on a separate Radio Button?

本文关键字：获取 数组 单选按钮 节点 单独 Mustache      更新时间：2023-09-26

环境：Node、Express、Mu2Express、mongoose

我想做的是从mongoose中获取一个数组，并让模板将每个值渲染为自己的单选按钮。

找不到示例。

我目前拥有的：

app.js:中的路由

app.get('/mutest',function(req, res){
  var data = [1,2,3,4];
  res.render('muTest',{
    'locals': {
      data: data }});
});

模板（muTest.listhes）

<form name="test" action="muTest" method="post">
    {{#data}}
        <input type="radio" name="choice" value={{data}}>{{data}}<br/>
    {{/data}}
    <input type="submit" value="Submit">
</form>

结果：

  • 1,2,3,4
  • 1,2,3,4
  • 1,2,3,4
  • 1,2,3,4

当然，选择任何一个按钮都会提交"1,2,3,4"的值。

我想要什么：用于页面的呈现方式如下：

  • 1
  • 2
  • 3
  • 4

提交了一个值（例如字符串"3"）。

TIA有任何建议！

诀窍是你必须引用当前指向的项目：

在第一种情况下，您使用｛｛data｝｝作为引用数据数组的值（以及单选按钮的文本）。

在第二种情况下，您使用的是｛｛data[0]｝｝，它将始终引用数组的第一个元素。

对于胡子（符合超级规范），您必须将值（1,2,3,4）包装到一个对象中：

data = [
   {value: 1, label: 1}, 
   {value: 2, label: 2}, 
   ....
];

然后：

<form name='test' action='muTest' method='post'>
    {{#data}}
        <input type='radio' name='choice' value={{#value}}>{{#label}}</input/><br/>
    {{/data}}
    <input type='submit' value='Submit'/>
</form>

在splash.js中，｛｛.｝｝运算符就像在javascript中使用"this"对象（或在python中使用self等）：

<form name='test' action='muTest' method='post'>
    {{#data}}
        <input type='radio' name='choice' value={{.}}>{{.}}</input/><br/>
    {{/data}}
    <input type='submit' value='Submit'/>
</form>

输出为：

<form name='test' action='muTest' method='POST'>
    <input type='radio' name='choice' value='1'>1</input><br/>
    <input type='radio' name='choice' value='2'>2</input><br/>
    <input type='radio' name='choice' value='3'>3</input><br/>
    <input type='radio' name='choice' value='4'>4</input><br/>
    <input type='submit' value='Submit'/>
</form>
相关文章：