Question: I am following the pro angular 6 3rd edition book tutorial and I am finding it hard to resolve the issue with value of a $event.target. it is suppose to be an option to limit the number of articles per page on display. but I cannot get it to work, my main issue now I think is that the feature is no longer available in angular 12.

ts code is as follows:

...

```
changePage(newPage: number){
    this.selectedPage = newPage;
}

changePageSize(newSize: number){
    this.productsPerPage = Number(newSize);
    this.changePage(1);
}

get pageNumbers(): number[]{
    return Array(Math.ceil(this.repository.getProducts(this.selectedCategory)
      .length / this.productsPerPage)).fill(0).map((x, i)=> i +1);
 } 

```

...

```
enter code here

```

html template part with the issue
...

```
 <select class="form-control" [value]="productsPerPage"
    (change)="changePageSize($event.target.value)">
        <option value="3">3 per Page</option>
        <option value="4">4 per Page</option>
        <option value="6">6 per Page</option>
        <option value="8">8 per Page</option>
    </select>

```

...
I appreciate any solutions that may help.

Answer: 
As mentioned in the angular [documentation](https://angular.io/guide/template-typecheck)

> 
> When using $event.target for DOM events (because of the possibility of
> event bubbling, $event.target in the DOM typings doesn't have the type
> you might expect) in that case we can use $any() type-cast function opt out of type-checking for a part of the expression
> 
> 
> 

```
<select class="form-control" [value]="productsPerPage"
    (change)="changePageSize($any($event.target.value))">
        <option value="3">3 per Page</option>
        <option value="4">4 per Page</option>
        <option value="6">6 per Page</option>
        <option value="8">8 per Page</option>
 </select>

```
inside (change), you should pass $event only. Inside logic, you should take event.target.value