Javascript 将两个表行交替放置在一起，然后再放置下两个表行

我的想法是，我想有一个表，有两行绿色，然后是两行黄色，然后是绿色等等。我尝试使用：nth child，但它没有真正的工作。 我使用angular 6制作自动工作台，使用angular material 6制作样式

下面是我用来试验的stackblitz：

根据要求：浏览器的屏幕截图

如您所见，第一个td为蓝色，而第二个td为默认颜色（白色）

---

当使用

multiTemplateDataRows

时（如示例中所示），您可以使用

dataIndex

属性使用ngClass应用类。例如（代码的修改摘录）：

您能否澄清、共享呈现的html以及您实际获得的内容（白色、绿色或黄色背景，如果在tr上绘制了任何bg…或td，如果您选择了tds。在链接中，您可以看到我的代码以及浏览器视图。但是对于您，我截屏了浏览器视图。您的链接没有向我显示任何代码，在主体标记和呈现页面之间保持空白…因此除了这么多代码之外，没有什么可看的要加载的库。当涉及CSS问题时，屏幕截图也是无用的。需要的是一些HTML样式和您尝试的内容；）@G-Cyr-假设是你，请删除你的否决票。这是一个好问题，stackblitz示例运行良好，有助于找到解决方案。您好，我假设您没有阅读我的评论……请澄清您的问题，以便有人能帮到您。也感谢您让我觉得我在您身上浪费了时间。请重新阅读我以前的评论nts。我不认识你，我只是不知道有什么办法可以帮助你远离这个问题留给我们的关于你的问题的线索，是的，N-child（）似乎就是这样。你在链接上的CSS片段甚至没有显示你对此做了什么；）。祝你好运。我会试试这个，谢谢你的主意！

<tr mat-row *matRowDef="let element; let i = dataIndex; columns: columnsToDisplay"
    class="example-element-row" 
    [class.example-expanded-row]="expandedElement === element" 
    [ngClass]="i % 2 === 0 ? 'green' : 'yellow'"
    (click)="expandedElement = element">
</tr>
<tr mat-row *matRowDef="let row; let i = dataIndex; columns: ['expandedDetail']"
    class="example-detail-row" 
    [ngClass]="i % 2 === 0 ? 'green' : 'yellow'">
</tr>