如何在Bootstrap Modal中为动态点击生成的变量设置jade属性

How can jade attributes be set for Dynamically click generated variables in Bootstrap Modal?

本文关键字：变量 设置 属性 jade Bootstrap Modal 动态      更新时间：2023-09-26

我已经通过mongoose向我的Jade文件返回了一个有效的JSON，名为things的JSON看起来像这样，

[{
   _id: ObjectId("7788h356i0909v7863b75999"),
   important: "Critical123",
   property:[{name: "Test456"},{name: "Test789"},{name: "Test101112"}]
 },
 {
   _id: ObjectId("7788h356i0909v7863b75908"),
   important: "Critical",
   property:[{name: "TestNew"},{name:"TestNewlyOpened"}]
  }
]

我有一个玉文件，里面吐出了我想要的页面的细节，就像下面一样

基本上，当你点击字形图标加号时，我打开了一个模式窗口

if thing
   each something in thing
          tr.odd.gradeX(id="firstRow" rowspan="2")
             td.imp(type="button") #{something.important}
               a.glyphicon-plus-sign(id="#{something._id}" data-toggle="modal" data-target=".bs-example-modal-lg")

我的模态在下面的同一文件中声明为

.modal.fade.bs-example-modal-lg(id="modalBoxSomething" tabindex='-1', role='dialog', aria-labelledby='myLargeModalLabel', aria-hidden='true', style='display: none;')
  .modal-dialog.modal-lg
    .modal-content
      .modal-header#headerModal
        h4#myLargeModalLabel.modal-title
        button.close(id="modalCloseButton" type='button', data-dismiss='modal', aria-label='Close')
          span(aria-hidden='true') ×           
      .modal-body
        .somethingDetails.col-md-6.col-lg-6
         if property
            each nameProperty in property 
              p#propertyName #{nameProperty.name}

这行不通。对于特定项目click event，我可以在array中的nested sub items上循环吗？

我想为这个modal window中的每个something重复property数组的值。

或者我应该写一个Javascript来做这件事吗？

for(var k=0; k<things.length; k++){
      for(var m=0; k<things[k].property.length; m++){
         $('#propertyName').append('<p>'+JSON.stringify(things[k].property[m].name+'</p>');
      }
}

这里的最佳做法是什么？Javascript解决方案是有效的，但如果我在Jade中尝试实现的目标能完美实现，那就太好了。

对于特定的项目单击事件，我可以在数组中的嵌套子项目上循环吗？

你当然可以。Jade模板是使用JavaScript渲染的，您也可以通过在行的开头使用-在模板中使用原始JavaScript。如果您的JavaScript代码符合您的要求，您可以将其逻辑移动到模板文件中。

这里的最佳做法是什么？

使用翡翠。

尚不清楚模板文件中的property是什么。如果你希望Jade知道它是一组对象的属性，但事实并非如此。您需要遍历数组，然后遍历每个对象元素的property数组，即2个嵌套循环。

假设您已将things标识符用于阵列：

each thing, index in things 
  h2.sample= thing.important
  each item in thing.property
     p.propertyName= item.name

请注意，ID必须是唯一的，否则您生成了无效的标记。

相关文章：