html - Angular(4 或 2)如果满足条件则应用 CSS

Question

我找到了一些代码示例，它们解释了在满足条件的情况下如何应用类元素。

在我的 .ts 文件中有以下内容:

private readNews : boolean = false;

[..]

  ngOnInit() {
    localStorage.setItem('readNews', 'Read');

    if (localStorage.getItem('readNews') != null || '') {
      this.readNews = true;
    }
  }

在我的 HTML 中，我有以下内联 CSS:

<i class="fal fa-cogs fa-5x"></i>

但是，我希望它是以下内容:

如果 this.readNews === true

<i class="fal fa-cogs fa-5x blink"></i>

因此需要在读取新闻时(保存在localStorage中)在CSS中添加'blink'。

Answer 1

像这样尝试:

<i [ngClass]="readNews ? 'fal fa-cogs fa-5x blink': 'fal fa-cogs fa-5x'"></i>