estoy armando componentes web con stencil.js y trabajo en este momento con la creación de un input para formularios, el tema es que tengo que agregarle el atributo formControlName="", para poder exportarlo a un proyecto con Angular. El tema es que no logro pasarle este atributo al componente que genero:
import { Component, Host, h, Prop, State } from '@stencil/core';
@Component({
tag: 'input-text',
styleUrl: 'inputext.css',
shadow: true
})
export class Inputext {
@Prop({ reflectToAttr: true })
disabled: boolean;
@Prop() value: string;
@Prop() maxlength: number;
@Prop() minlength: number;
@Prop() title: string;
@Prop() placeholder: string;
@Prop() type: string;
@Prop() formcontrolname: string;
@State() formControlName: string;
render() {
return (
<Host>
<label>{this.title}</label>
<input type={this.type}
placeholder={this.placeholder}
formControlName={this.formcontrolname}
value={this.value} maxlength={this.maxlength}
minlength={this.minlength}
disabled={this.disabled} />
</Host>
);
}
}
y este es el componente en el html:
<input-text type="text" title="First Input" formControlName="numerosPrimos" placeholder="Holo" maxlength="12"></input-text>
Quedo atento a sus comentarios!