Блог

Главная - Вопросы по программированию - Shadow DOM: как использовать пользовательские элементы ввода в собственном теге формы?

Shadow DOM: как использовать пользовательские элементы ввода в собственном теге формы?

#html #angular #web-component #shadow-dom

#HTML #angular #веб-компонент #shadow-dom

Вопрос:

Я использую Angular8 для создания некоторых пользовательских элементов. Некоторые из моих пользовательских элементов содержат тип ввода. Мне нужно использовать shadow DOM, поэтому в моем компоненте angular я настроил encapsulation:ViewEncapsulation.ShadowDom

Пример: myInput.component.html

  <slot></slot>
 <input type="text" name="{{myInputTextId}}" id="{{myInputTextId}}">

Как я могу использовать <app-myInput></app-myInput> в собственной HTML-форме? Я не хочу иметь:

 <form method="POST" action="/saveUsername">
    <app-myInput name="firstName" id="firstId">My text </app-myInput>
</form>