Антон Швец

Примерно 300кб сам фреймворк и роутинг. Если динамики почти нет - зачем вообще не тащить фреймворк? Можно посмотреть на svelte

Если однократная передача то через инжектор.
Еще общаться можно через сервисы или получив componentInstance.
Если прям в шаблон надо инпуты, то есть либы типа https://github.com/IndigoSoft/ngxd но как правило можно и без них. Поскольку все типизируется, а тут получается динамический непредсказуемый инпут.
Лучше тогда сделать обертку с ngSwitch. Чуть медленнее, но понятней.

Все вычисляемые или просто асинхронные вещи нужно хранить в Observable. Будет полный аналог вашего computed.
Например есть переменная
src = new BehaviorSubject(1);

От нее вычисляем класс

myClass = this.src.pipe(map(v => v === 1 ? 'one' : 'two'))

В шаблоне будет
div [ngClass]="myClass | async"

При изменении src, т.е. src.next(2)
Будет пересчитан myClass (один раз) и изменится шаблон (тоже один раз, если нет других причин для изменений и стоит on-push)
А если его нигде не запросить, то пересчета не будет, т.к. это ленивое вычисление, так же как и computed.

Подобным образом менеджатся любые данные и события, и это гораздо более гибкая система, чем скрытые геттеры-сеттеры в vue, хотя иногда более многословная. И требует больше времени на освоение.

Зачем вам всю форму передавать, если вам только признак валидности нужен?

@Output() formValid = this.customerForm.statusChanges.pipe(map(() => this.customerForm.valid))

Потому что ваш компонент, реализующий ControlValueAccessor , знать ничего не знает про ошибки в контроле формы. Он вообще про этот контрол ничего не знает, связующим звеном тут служит директива formControl, которая слушает контрол и при внешнем изменении его вызывает writeValue.

Можно сделать свою еще директиву которая будет вызывать другой метод, типа setErrors, но стандартной такой функции нет.
Вот в этой статье можно найти похожую реализацию, только там передаются pristine и touched. https://habr.com/ru/post/491062/

Или проще, просто передать ошибки внутрь через инпут :)
А чтобы наоборот, перекинуть внутренние ошибки на верхний контрол нужно реализовать Validator

Чет у вас каша.
Подписка на сокет это не дело конкретной страницы, это задача для логики на уровне всего приложения. Если бизнес-задача такова что нужно открыть подписку при открытии страницы, то страничка должна извещать сервис о своей активности.

Допустим я выхожу со страницы "/home/request;id=24". После такого выхода история url-перемещений как бы удаляется, я не могу вернуться на неё путём нажатия на кнопку "назад"

router.navigate оставляет историю перемещений, если не указано дополнительных опций. location трогать не надо вообще.

Socket (на клиенте) инициализируется на нескольких страницах:
this.socket.on('server-response', data => { })

Сделовало бы сделать в каком-нибудь сервисе

serverResponse = new Observable(observer => {
  this.socket.on('server-response', data => ovserver.next(data));
  return () =>  this.socket.removeListener('server-response');
}).pipe(share());

И потом на странице просто подписываешься на этот поток, а в ngOnDestroy() отписываешься.

Тут нет обработки ошибок соединения или дисконнекта, советую разобраться со всем самому. Возможно пригодится fromEvent или fromEventPattern

В гварде инжектнуть сервис нотификаций и дернуть метод

Если я воспользуюсь свойством event.target, то получу поле типа EventTarget у которого нет никаких свойств

Правильно, потому что это универсальный тип, который не может знать откуда вы этот эвент получили. Источником евента является объект, имплементирующий интерфейс EventTarget, и большего эвенту и не надо.
Надо просто прописать явно что именно получаете.

@HostListener('document:keydown', ['$event', '$event.target'])
  public someMethod(event: KeyboardEvent, target: HTMLElement) {
    console.log('event', event, target);
  }

Слушать Tab и отключить дефолтное поведение

Там вообще довольно сложный процесс, но коротко - все резолверы запускаются одновременно, в процессе работы складывают свои результаты в data, а роутер ждет через concatMap (и подписка которую вы не нашли внутри него) когда вся пачка завершиться, чтобы продолжить роутинг.

Т.е. любой резолвер должен завершиться. Запустить интервал здесь не получится, роутинг просто повиснет.
Такое лучше поместить в OnInit и прекращать при дестрое.

Легко гуглится
https://stackblitz.com/edit/angular-material-selec...

Потому что завершенный обсервабл может быть переключен на другой, который не завершится.
По этой же причине и от хттп надо отписываться, одноразовый запрос может быть переключен на другой и за ним не уследишь.

удалить этот ворох кода и сделать оператор (назовите как удобнее)

export const handler = <T>() => pipe(
        map((value: T) => ({ loading: false, value })),
        startWith({ loading: true }),
        catchError(error => of({ loading: false, error })),
        shareReplay({ refCount: true, bufferSize: 1 }),
      )

потом в сервисе просто

getAdministrators() {
  return this.http.get<IAdministrator[]>(`api/v1/admin/users`).pipe(handler())
}

все префиксы к юрл переносим в интерцептор

в компоненте делаем дата-сурс через pipe(map(...))
Обсерваблы выводятся в темплейт через асинк-пайпы. И все, явные подписки тут не нужны.

timer(5001).pipe(
  src => merge(
    src, 
    timer(5000).pipe(
      tap(() => console.log('5s')),
      takeUntil(src),
    ),
  ),
  finalize(() => console.log('end')),
)

В консольке через 5 сек после подписки появится надпись 5s. Если time будет меньше 5 секунд, то не появится, будет только end