SgcUiText

Custom SGC Text UI Components based on Angular and Material.

Text UI Component

1. Component SgcUiTextComponent inherit BaseFieldFormEditUI

2. Selector

<sgc-ui-text></sgc-ui-text>

3. TFieldFormTextDataDefault TFieldFormTextDataDefault is the default constructor for all Text field component.

export const TFieldFormTextDataDefault: TFieldFormEditData = {
  ...TFieldFormEditDefault,
  minLength: 0,
  maxLength: 524288 /*--- Default Input maxLength limit*/,
  showPrefixIcon: false,
  showSuffixIcon: false,
  showPrefixText: false,
  showSuffixText: false,
  typeFieldForm: TypeFieldFormEdit.TEXTE
};

4. Example

//--- Declare and Init TSgcTextData variable
class AppComponent implements OnInit {
  mytexte1!: TFieldFormEditData;
  mytexte2!: TFieldFormEditData;

ngOnInit() {
    this.mytexte1={...TFieldFormTextDataDefault, name:'texte1', label: 'Mon champ texte 1', required:true, maxLength:10};
    this.mytexte2={...TFieldFormTextDataDefault, name:'texte2', label: 'Mon champ texte 2', disabled:false};
  }
}

    <sgc-ui-text [(data)]="mytexte1"></sgc-ui-text>
    <sgc-ui-text [(data)]="mytexte2"></sgc-ui-text>