Как обновить тему поведения после запроса патча?

Я обновил ваш stackblitz решением. Вот что вам нужно сделать.

В main.service.ts,

Сохраните ссылку на todos в самом сервисе для будущих обновлений. Смотри ниже.

private allTodos: Todo[];

  getTodo() {
    if (!this.allTodos$){
      this.allTodos$ = <BehaviorSubject<Todo[]>>new BehaviorSubject(new Array<Todo>());
      this.http
        .get<Todo[]>(
          'https://jsonplaceholder.typicode.com/todos'
      ).subscribe(
          (data: Todo[]) => {
            this.allTodos = data;
            this.allTodos$.next(data);
          }
        ),
        error => console.info(error);
    }    
  }

Возвратите BehaviourSubject непосредственно из метода subscribetoTodos. Темы могут быть подписаны напрямую.

subscribetoTodos(): Observable<Todo[]>{
    return this.allTodos$;
  }

обновите метод updateToDo, как показано ниже. Обратите внимание, как я обновляю здесь одну ссылку на Todo в списке и отправляю ее подписчикам через next.

updateTodo(id){
    this.http.patch('https://jsonplaceholder.typicode.com/todos/' + id , { 'completed': true })
    .subscribe(
      data => {
        this.allTodos.find(todo => {
          if (todo.id === id) {
            Object.assign(todo, data);
            return true;
          }
          return false;
        });
        console.info(data);
        this.allTodos$.next(Object.assign([], this.allTodos));
      },
      error => console.info(error)
    )
  }

Это обновит ваш взгляд.

В случае разбитых на страницы данных измените подписку на указанную ниже.

ngOnInit() {
    this.todos$ = this.mainService.subscribetoTodos();
    this.todos$.subscribe(
      (data)=>{
      this.page = this.page || 1;
      this.pageSize = 10;
      }
    )
  }

Обратите внимание, как я проверяю, существует ли this.page, а затем использую его, иначе перейдите на страницу 1.

this.page = this.page || 1;

Раньше было,

this.page = 1;

который сбрасывал страницу обратно на 1 всякий раз, когда происходило какое-либо обновление.