Угловая ошибка типа: объект (_co.book) имеет значение null?

Вот что показывает консоль:

ОШИБКА TypeError: "_co.book is null" View_SingleBookComponent_0 SingleBookComponent.html: 3 Angular 24 RxJS 5 Angular 11 SingleBookComponent.html: 3: 4 ERROR CONTEXT {…} elDef: Object {nodeIndex: 2, bindingIndex: 0, outputIndex: 0, вывод: 0 ,…} ElView: Object {def: {…}, родитель: {…}, состояние: 1164,…} nodeDef: Object {nodeIndex: 3, bindingIndex: 0, outputIndex: 0,…} nodeIndex: 3 view: Object {def: {…}, родитель: {…}, состояние: 1164,…}...

На странице должна отображаться информация о книге (имя автора и название книги)

Это код single-book.component.ts:

export class SingleBookComponent implements OnInit {

  book: Book;

  constructor(private route: ActivatedRoute, private booksService: BooksService,
              private router: Router) {}

  ngOnInit() {
    this.book = new Book('', '');
    const id = this.route.snapshot.params[' id'];
    this.booksService.getSingleBook(+id).then(
      (book: Book) => {
        this.book = book;
      }
    );
  }

  onBack() {
    this.router.navigate(['/books']);
  }
}

 //This is the book-form.component.ts code

export class BookFormComponent implements OnInit {
  bookForm: FormGroup;
  fileIsUploding = false;
  fileURL: string;
  fileUploaded = false;

  constructor(private formBuilder: FormBuilder,
              private booksService: BooksService,
              private router: Router) { }

  ngOnInit() {
    this.initForm();

  }
  initForm() {
    this.bookForm = this.formBuilder.group({
      title: ['', Validators.required],
      author: ['', Validators.required]
    });
  }
  onSaveBook() {
    const title = this.bookForm.get('title').value;
    const author = this.bookForm.get('author').value;
    const newBook = new Book (title, author);
    if (this.fileURL && this.fileURL !== '' ) {
      newBook.photo = this.fileURL;
    }
    this.booksService.createNewBook(newBook);
    this.router.navigate(['/book']);
  }