Почему кнопка внутри таблицы в модале не работает?

Question

Почему кнопка внутри строки таблицы не работает?

Я ожидаю, что она напечатает сообщение в консоли только при вызове функции в файле modal-basic.ts.

modal-basic.html:

<td><button (click)="test()">Test</button></td>

modal-basic.ts:

test() {
  console.log("Test...");
}

Вы можете найти минимальную воспроизводимостьпример в следующем StackBlitz: https://stackblitz.com/edit/angular-bpp4uh

Answer 1

Я сделал некоторые изменения.

убрал этот код в тс.

 get countries(): Country[] {
    return COUNTRIES
      .map((country, i) => ({id: i + 1, ...country}))
      .slice((this.page - 1) * this.pageSize, (this.page - 1) * this.pageSize + this.pageSize);
  }

объявить

countries = [];

добавить в ngOnit или конструктор ()

{this.countries = COUNTRIES;}

В html

 *ngFor="let country of countries | slice: (page-1) * pageSize : (page-1) * pageSize + pageSize"

<ngb-pagination
  [(page)]="page"
  [pageSize]="pageSize"
  [collectionSize]="countries.length"></ngb-pagination>

вот ссылка:

https://stackblitz.com/edit/angular-8dxiv4