为什么我不能在我的 Angular 应用程序中使用 MomentJS 为日期添加年份？

Question

我正在开发一个 Angular 应用程序，尝试使用 momentJS 将特定年数添加到日期，但它似乎不起作用。

这是我的代码：

changeGuaranteeEndDate(guaranteeDuration) {
    console.log("changeGuaranteeEndDate() START");
    console.log("GUARANTEE START DATE: " + this.newAssetForm.value.guarantee_start_date);
    console.log("GUARANTEE DURATION: " + this.newAssetForm.value.guarantee_duration);
    console.log("EVENT VAL: " + guaranteeDuration);

    this.newAssetForm.value.guarantee_duration = guaranteeDuration;
    console.log("GUARANTEE DURATION: " + this.newAssetForm.value.guarantee_duration);

    let myMoment: moment.Moment = moment(this.newAssetForm.value.guarantee_start_date);
    console.log("myMoment: ", myMoment);

    let myMoment2 = myMoment;
    myMoment2.add(3, 'y')

    console.log("myMoment2: ", myMoment2);
}

所以我基本上是从 this.newAssetForm.value.guarantee_start_date 中定义的日期开始创建 myMoment 对象。

然后我尝试从 myMoment 开始创建一个新的 myMoment2 对象，并且我将向该对象添加 3 年。终于打印出来了

问题是在 Chrome 控制台中我得到以下输出：

myMoment:  
Moment {_isAMomentObject: true, _i: Fri Jan 29 2021 13:04:29 GMT+0100 (Ora standard dell’Europa centrale), _isUTC: false, _pf: {…}, _locale: Locale, …}
_d: Mon Jan 29 2024 13:04:29 GMT+0100 (Ora standard dell’Europa centrale) {}
_i: Fri Jan 29 2021 13:04:29 GMT+0100 (Ora standard dell’Europa centrale) {}
_isAMomentObject: true
_isUTC: false
_isValid: true
_locale: Locale {_calendar: {…}, _longDateFormat: {…}, _invalidDate: "Invalid date", _dayOfMonthOrdinalParse: /\d{1,2}(th|st|nd|rd)/, ordinal: ƒ, …}
_pf: {empty: false, unusedTokens: Array(0), unusedInput: Array(0), overflow: -2, charsLeftOver: 0, …}
__proto__: Object

myMoment2:  
Moment {_isAMomentObject: true, _i: Fri Jan 29 2021 13:04:29 GMT+0100 (Ora standard dell’Europa centrale), _isUTC: false, _pf: {…}, _locale: Locale, …}
_d: Mon Jan 29 2024 13:04:29 GMT+0100 (Ora standard dell’Europa centrale) {}
_i: Fri Jan 29 2021 13:04:29 GMT+0100 (Ora standard dell’Europa centrale) {}
_isAMomentObject: true
_isUTC: false
_isValid: true
_locale: Locale {_calendar: {…}, _longDateFormat: {…}, _invalidDate: "Invalid date", _dayOfMonthOrdinalParse: /\d{1,2}(th|st|nd|rd)/, ordinal: ƒ, …}
_pf: {empty: false, unusedTokens: Array(0), unusedInput: Array(0), overflow: -2, charsLeftOver: 0, …}
__proto__: Object

问题在于，正如您在之前的输出中看到的那样，似乎年份没有添加到原始myMoment 对象中。

我的代码有什么问题？我错过了什么？如何正确地将年份添加到我的原始 myMoment 对象？

Answer 1

它对我有用....您可以点击下面的Run code Snippet 对其进行测试。

您可以尝试使用与我的示例相同的加载库：src moment.min.js

function changeGuaranteeEndDate(guaranteeDuration) {
    console.log("changeGuaranteeEndDate() START");
    console.log("GUARANTEE START DATE: " + this.newAssetForm.value.guarantee_start_date);
    console.log("GUARANTEE DURATION: " + this.newAssetForm.value.guarantee_duration);
    console.log("EVENT VAL: " + guaranteeDuration);

    this.newAssetForm.value.guarantee_duration = guaranteeDuration;
    console.log("GUARANTEE DURATION: " + this.newAssetForm.value.guarantee_duration);

    let myMoment = moment(this.newAssetForm.value.guarantee_start_date);

    console.log("myMoment: ", myMoment);

    let myMoment2 = myMoment;
    myMoment2.add(3, 'y')

    console.log("myMoment2: ", myMoment2);
}

// This is just for Testing the function... and mocking object
changeGuaranteeEndDate.apply({
  newAssetForm:{
    value:{
      guarantee_start_date:new Date(),
      guarantee_duration:undefined
    }
  }
})

<script       src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.29.1/moment.min.js"></script>

Answer 2

好的，你需要format()来显示moment对象的值。基本上问题是你传递给它的初始值。在answer 中阅读更多相关信息。所以你的最后一个控制台日志应该是这样的：

console.log("myMoment2: ", myMoment2.format());