Angular outputEvent as prescribed in the docs don't work

Question

I'm following the angular docs(https://docs.angular.lat/guide/inputs-outputs) to set an outputevent from my child to parent component (the input works that is no issue). There is a bit more logic happening inside the components but I've only put the relevant code so it would also be reproducible. According to the docs, I've put in my child component like this in the ts file:

  
export class PaginationComponent implements OnInit {
  @Input() totalProducts!:number;
  @Output() newItemEvent = new EventEmitter<string>();
  pageLimit:number=5;
  ngOnInit(): void {}

  generatePagination(pageNumber:number){
    this.newItemEvent.emit("here is the pageSize: " + this.pageLimit + " and the 
    pageNumber " + pageNumber);
  }
}

In my parentComponent, In the parent.html I've placed the paginationComponent like this:

<app-pagination *ngIf="totalProducts" 
[totalProducts]="totalProducts"
(newItemevent)="paginatePage($event)"
></app-pagination>

In the parent.ts I've put this function to catch the outputted event:

export class ParentComponent implements OnInit {
  constructor() { }

  paginatePage(value: string){
      console.log(value);
  }
}

Again, I followed the docs here. When I try to build this, I get an error:

error TS2345: Argument of type 'Event' is not assignable to parameter of type 'string'.

35 (newItemevent)="paginatePage($event)"

Offcourse you would say, this error looks clear. But this is how the docs state I should do it. If I read the error and change function in the parent to paginatePage(value: Event){}, it does compile. But than nothing happens when I trigger the generatePagination function in the child component. How can I catch the output event in the parent?

Answer 1

The reason why the outputevent as stated in the documents don't work, is because there is a typo in the official documentation. Here below I show this typo.

(newItemEvent)="paginatePage($event)" 

instead of

(newItemevent)="paginatePage($event)".
´´´