Question

我想比较ngIf中的数字，并根据结果显示一些内容。

  <div>
      <div *ngIf="dateNumber(user.date)>18">
     {{  dateNumber(user.date) }}
      </div>
      <div *ngIf="dateNumber(user.date)<18">
        {{  dateNumber(user.date) }}
        </div>
    </div>

我的号码。ts

 dateNumber ( date: Date) {
    const now = new Date().getFullYear()
    const diff = Math.abs(now - new Date(date).getFullYear())
    console.log(diff)
    return diff 
}

它将返回一个数字，当我执行控制台日志时，它将返回一个数字。

这不起作用，我认为“>”＆“ <”运算符有问题，有没有办法使其起作用？

Answer 1

在dateNumber函数中，您将( date: Date)作为Date类型传递。因此，请确保在调用dateNumber()函数时，该函数必须为Date类型。

如果您要输入字符串或其他任何内容，它将无法正常工作。

这是正在唤醒的 example

PS：请不要忘记在比较中添加>=，否则等于18时不会显示任何内容。

*ngIf="dateNumber(user.date)>=18"

Answer 2

请确保在dateNumber内部发送的自变量的类型为date或string，可以转换为日期。

如果date参数不是有效日期，则可以使用以下代码。

  dateNumber(date: Date) {
    const now = new Date().getFullYear();
    const diff = Math.abs(now - new Date(date).getFullYear());
    console.log(diff);
    if (isNaN(diff)) {
      return 0;
    } else {
      return diff;
    }
  }

有关正在运行的示例，请参阅以下链接：-

https://stackblitz.com/edit/angular-x5cofc?file=src%2Fapp%2Fapp.component.ts

希望有帮助。

如何在* ngIf

2 个答案: