title: ERROR TypeError: Cannot read property 'filter' of undefined typescript
body: <p>I wanted to filter the list of books depending on the clicked author on the left. the authors and the books are in separate arrays, so I got the author id when clicking with route.params and trying to filter books depending on that id but it gives me an error.</p>
  
  <p>How should I filter books on the right with the clicked author??</p>
  
  <pre><code>    import { Component, OnInit } from '@angular/core';
  import { BooksService } from '../shared/books.service';
  import { ActivatedRoute, Params } from '@angular/router';
  import { Book } from './book.model';
  
  @Component({
    selector: 'app-books',
    templateUrl: './books.component.html',
    styleUrls: ['./books.component.scss']
  })
  export class BooksComponent implements OnInit {
    books: Book[];
    filteredBooks: Book[];
    id: string;
  
    constructor(
      private booksService: BooksService,
      private route: ActivatedRoute
    ) {}
  
  
  
    ngOnInit() {
      this.booksService.booksChanged
      .subscribe(
        (books: Book[]) =&gt; {
          this.books = books;
        }
      );
      this.books = this.booksService.getBooks();
  
      this.route.params.subscribe((params: Params) =&gt; {
        this.id = params['id'];
        this.filteredBooks = this.booksService.books.filter(item =&gt; item.author === this.id);
        console.log(this.filteredBooks);
      });
    }
  }
  </code></pre>
  
  <p><a href="https://i.stack.imgur.com/BT3uh.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/BT3uh.png" alt="enter image description here"></a></p>