Angular 4年份显示正确性验证：当前年及当前年+7的实现

首先直接说结论：你的实现方式是不正确的，主要有两个关键问题：

问题分析 #

• 错误使用了setDate()方法：这个方法的作用是设置「一个月中的某一天」（比如把日期改成当月的15号），完全不是用来修改年份的。你想要调整年份，应该用setFullYear()方法才对。
• currentYearPlusSix1存储的是时间戳数字：setDate()执行后会返回一个时间戳（从1970年到当前的毫秒数），虽然Angular的date管道能勉强处理数字，但你的变量命名（plusSix却加了7）和逻辑逻辑完全偏离了预期。

正确的实现方式 #

我给你两种靠谱的方案，选你觉得顺手的就行：

方案1：直接计算年份数字（更简单直观） #

组件代码：

// 直接获取当前年份的数字值
currentYear = new Date().getFullYear();
// 直接计算当前年份加7的结果
currentYearPlusSeven = this.currentYear + 7;

HTML代码：

The current year is {{ currentYear }}
<br>
The current year plus seven is {{ currentYearPlusSeven }}

方案2：使用Date对象配合正确的年份设置方法 #

组件代码：

currentYear = new Date();
currentYearPlusSeven = new Date();
// 用setFullYear()正确设置目标年份
this.currentYearPlusSeven.setFullYear(this.currentYear.getFullYear() + 7);

HTML代码：

The current year is {{ currentYear | date:'yyyy' }}
<br>
The current year plus seven is {{ currentYearPlusSeven | date:'yyyy' }}

两种方案都能准确输出你想要的结果，个人更推荐方案1，直接操作数字不仅简单，还能避免Date对象操作带来的潜在问题～

内容的提问来源于stack exchange，提问作者Tom