Expression has changed after it was checked during iteration by map keys in angular 2

Don't bind to a method ...keys() in the template. It will be called every time change detection runs. object.keys() returns a new object every time it is called and Angular recognizes this as an unexpected change, which leads to your error.

You can fix it like

someMethod() {
  this.bindedAuthorsKeys = this.bindedAuthors.keys();
}

*ngFor="let author of bindedAuthorsKeys"

My map is the main source of the current data which is getting automatically synced from Firestore. If I do what is suggested in the accepted answer by Günter, I have to make sure to keep this array in sync with my map. Instead of this, I use the built-in keyvalue pipe of Angular directly with the map like follows:

<tr *ngFor="let author of bindedAuthors | keyvalue">
  <td> {{author.value}}</td>
  <td>
    <button (click)="onUpdate(author.value)"
            class="btn gl-btn-primary">Update
    </button>
  </td>
  <td>
    <button (click)="onDelete(author.value)" class="btn gl-btn-default">Delete</button>
  </td>
</tr>

Are there any caveats I am unaware of?

this.keysOfObject = Object.keys(---)   <---put your object or array inside.

    Now,
    <tr *ngFor="let author of keysOfObject">
    '
    '
    '
    </tr>