Angular：如何在条件中使用日期管道有条件地应用样式？

Question

我在<img src="http://10.0.0.110/video1.mjpg">中有一个数组，我想在我的component.ts中对其进行循环，然后在该数组中包含一个日期，因此对于数据，我想运行一个条件，如果该日期是大于当前日期，则应用特定的样式，如果不是，则应用其他样式。例如这样的东西：

component.html

Answer 1

假设您有一个日期数组：

export class AppComponent  {
  dates = ['2018-12-19', '2018-12-20', '2018-12-22'];
  todayDate = new Date();
}  

以及您的模板：

<div class="container">
   <div *ngFor="let d of dates; let i = index">
        <div [ngStyle]="{'background-color':  (d | date:today) > (todayDate | date:today) ? 'green' : 'red'}">
            <ul class="otherStyle">
                <li>{{d |date:today}}</li>
            </ul>
        </div>
    </div> 
</div>

这里是一个示例：Stackblitz