Question

我正在尝试使用Ionic（Cordova）创建一个简单的日历应用程序。我希望有一个日历事件列表和每个事件旁边的按钮，允许用户将事件添加到他/她的日历中，或者如果它已经存在则将其删除。此外，为了便于使用，我还设置了一个按钮，将所有事件添加到日历中。

我的问题是在forEach中使用Promise。让我从代码开始，这是来自Cordova（Ionic）应用程序：

addAllEvents() {
  this.events.forEach((event: CalendarEvent, index, array) => {

    Calendar.createEvent(event.title, event.location, event.notes, event.startDate, event.endDate).then(
      (msg) => {
        console.log(msg);
        event.isInCalendar = true;
      },
      (err) => {
        console.log(err);
      }
    );

  });
}

addAllEvents()应该做的是（在页面上按下按钮时）将events数组中的所有CalendarEvent添加到用户的Calendar中，并将事件的isInCalendar属性更新为true。 isInCalendar用于决定每个事件旁边显示的按钮（添加或删除）：

<button *ngIf="!event.isInCalendar;" ion-button rounded (click)="addEventToCalendar(i);">Add to calendar</button>
<button *ngIf="event.isInCalendar;" ion-button color="danger" rounded (click)="removeEventFromCalendar(i);">Remove from calendar</button>

但是，执行时，addAllEvents()仅更改上一个事件的isInCalendar属性！（根据只有最后一个按钮改变的事实判断）

我怀疑发生的事情是forEach将事件绑定到events数组中的每个连续项，并且当Calendar返回Promise时，事件对象引用events数组中的最后一项，这意味着Promises是仅修改最后一个事件。

请帮我解决这个困惑！

P.S。

单个addEventToCalendar（）和removeEventFromCalendar（）函数正常工作。这是他们的代码：

addEventToCalendar(index: number) {
    let event = this.events[index];
    Calendar.createEvent(event.title, event.location, event.notes, event.startDate, event.endDate).then(
      (msg) => {
        console.log(msg);
        event.isInCalendar = true;
      },
      (err) => {
        console.log(err);
      }
    );
  }

removeEventFromCalendar(index: number) {
    let event = this.events[index];
    Calendar.deleteEvent(event.title, event.location, event.notes, event.startDate, event.endDate).then(
      (msg) => {
        console.log(msg);
        event.isInCalendar = false;
      },
      (err) => {
        console.log(err);
      }
    );
}

承诺forEach和变量引用

0 个答案: