Телеграмм чат группы angularkyiv страница 1094

Size: a a a

Angular Kyiv

631 membersпожаловаться на группу

2021 October 07

Yexela in Angular Kyiv

Меня немного сбил тот факт, что когда это работает вне Cypress - все отрабатывает корректно

источник

21:52пожаловаться #1

Artyom Krasnyuk in Angular Kyiv

чтобы подружить такой инпут с реактивной формой тебе нужно сделать кастомный форм контрол (обёртку над input file) - https://blog.angular-university.io/angular-custom-form-controls/

дальше у тебя 2 пути - чтобы отправить файл на сервер вместе с остальной формой тебе нужно конверить его в base64 (занимает на 33% места больше чем бинарный файл)
или же отправлять файл в бинарном виде на сервер - отдельный запрос который отправляет FormData

Angular University

Angular Custom Form Controls - Complete Guide

Build a fully functional custom form control, compatible with template-driven and reactive forms, as well as with all built-in and custom form validators.

источник

21:53пожаловаться #2

Alex Chugaev in Angular Kyiv

Привіт. У когось є досвід створення плагіна для Хрома на Ангулярі?
Виникла проблема з комунікацією між плагіном і сторінкою

источник

21:59пожаловаться #3

Yexela in Angular Kyiv

Нет проблеми с отправкой файлов, есть проблема с Сypres

источник

21:59пожаловаться #4

Yexela in Angular Kyiv

Сейчас запишу видос

источник

22:00пожаловаться #5

Yexela in Angular Kyiv

Screen Recording 2021-10-07 at 21.57.52.mp4

(2.93 Мб)

источник

22:01пожаловаться #6

Yexela in Angular Kyiv

Реализовано это через FormGroup

источник

22:02пожаловаться #7

Yexela in Angular Kyiv

источник

22:02пожаловаться #8

Yexela in Angular Kyiv

источник

22:02пожаловаться #9

2021 October 08

Valerii Petrenko in Angular Kyiv

Это решает проблему триггера change события file input в cypress. Дальше же, как верно указали в комментарии выше, нужно связать событие change инпута и патч контрола формы (например, как здесь https://medium.com/@amcdnl/file-uploads-with-angular-reactive-forms-960fd0b34cb5), так как контрол работает со свойством value, а оно становится путем к файлу, именно его в форме и видно (на видео Screenshot.... at..) и форма валидна, а сам выбранный файл находится в свойстве files.

Medium

File Uploads with Angular Reactive Forms

Reactive forms are great for basic inputs but what if we want to use them with file uploads? A really good reason to bind these two things…