javascript - 如何在 HERE 中循环

Question

我在代码外创建了一个循环，后来我决定将其放入 HTML/jquery 表中，但每次我复制粘贴时它根本不起作用。有没有可能把 foreach 放在里面？ Here is the Table "在"循环"中应该是通过foreach生成的文本"

$rows += @"
    <div id="tabs">
      <ul>
        <li><a href="#tabs-1">Deutsch (DE)</a></li>
        <li><a href="#tabs-2">Englisch (EN)</a></li>
      </ul>
      <div id="tabs-1">
      <p>LOOP 1</p>
     </div>
      <div id="tabs-2">
        <p>LOOP 2</p>
      </div>

    </div>
    "@

循环

$tfsWis.Query("Select * from sth where [sample]  <> '' order by [Iteration Path] desc, Id desc") | Foreach-Object `
{
    $backgroundColor = 'background-color:green; color:white;'
    $item = $_
    if($oldIteration -and $oldIteration -ne $item.IterationPath)
    {
        $rows += @"
                </ul> 
        </ul> 
"@ 
    }
    if($oldIteration -ne $item.IterationPath)
    {
        $rows += @"
        <ul>        
            <li><div>$($item.Fields["it"].value) </div> </li>
                    <ul>

"@ 
    }
    $rows += @"
                    <li><div>$($item.Fields["ID"].value)</div></li>
                        <ul> 
                            <li>
                                <div>Title<br/>$($item.Fields["en"].value)</div>
                            </li>
                            <li> 
                                <div>Description<br/>$($item.Fields["deen"].value)</div>  
                            </li> 

                            <li>
                                <div>Titel<br/>$($item.Fields["dee"].value)</div>
                            </li> 
                            <li> 
                                <div>Beschreibung<br/>$($item.Fields["es"].value)</div> 
                            </li> 
                        </ul> 
"@
    $oldIteration = $item.IterationPath
}

Answer 1

在简化版本中，我只建议将选项卡和内容拆分为两个不同的变量，并根据返回的数据填充它们

循环完成后，您可以连接标题和内容

我已经基于原始代码构建了一个小示例，它应该可以完成您希望它执行的操作。请注意我的 powershell知识很生锈

$rowContent = @(
    ("title1", "content"),
    ("title2", "content 2"),
    ("title3", "content 3")
);
$tabheader = "<ul>";
$tabcontent = "";
$idx = 0;

for ($idx = 0; $idx -lt $rowContent.length; $idx++) {
    $item = $rowContent[$idx];
    $tabheader += "<li><a href='#tabs-$($idx)'>$($item[0])</a></li>";
    $tabcontent += "<div id='tabs-$($idx)'>$($item[1])</div>";
}
$tabheader += "</ul>";
$rows = "<div id='tabs'>$($tabheader)$($tabcontent)</div>";
Write-Host $rows;

如果你想保留你的多行字符串，你也可以使用 -f 标签来插入值，就像下面的例子一样

$rowContent = @(
    ("title1", "content"),
    ("title2", "content 2"),
    ("title3", "content 3")
);
$tabheader = "";
$tabcontent = "";
$idx = 0;

for ($idx = 0; $idx -lt $rowContent.length; $idx++) {
    $item = $rowContent[$idx];
    $tabheader += @"
        <li>
            <a href='#tabs-{0}'>{1}</a>
        </li>

"@ -f $idx, $item[0];
    $tabcontent += @"
    <div id='tabs-{0}'>
        {1}
    </div>

"@ -f $idx, $item[1];
}
$rows = @"
<div id='tabs'>
    <ul>
{0}
    </ul>
{1}
</div>
"@ -f $tabheader, $tabcontent;
Write-Host $rows;

输出结果

<div id='tabs'>
    <ul>
        <li>
            <a href='#tabs-0'>title1</a>
        </li>
        <li>
            <a href='#tabs-1'>title2</a>
        </li>
        <li>
            <a href='#tabs-2'>title3</a>
        </li>

    </ul>
    <div id='tabs-0'>
        content
    </div>
    <div id='tabs-1'>
        content 2
    </div>
    <div id='tabs-2'>
        content 3
    </div>

</div>