UNPKG

sgc-ng-field-form-edit

Version:

Custom SGC-NG-FIELD-FORM-EDIT UI Components based on Angular and Material. This component automatically generate SGC Component based on [TypeFieldFormEdit](https://www.npmjs.com/package/sgc-share-lib#2-typefieldformedit) ***

52 lines (40 loc) 1.52 kB
# SgcNgFieldFormEdit Custom SGC-NG-FIELD-FORM-EDIT UI Components based on Angular and Material. This component automatically generate SGC Component based on [TypeFieldFormEdit](https://www.npmjs.com/package/sgc-share-lib#2-typefieldformedit) *** ## Component SgcNgFieldFormEditComponent ```typescript @Component({ selector: 'sgc-ng-field-form-edit', templateUrl: `./sgc-ng-field-form-edit.component.html`, styleUrls: [`./sgc-ng-field-form-edit.component.scss`], }) class SgcNgFieldFormEditComponent implements OnInit { @Input() fieldForm!: TFieldFormEditData; @Output() fieldFormChange: EventEmitter<TFieldFormEditData> = new EventEmitter<TFieldFormEditData>(); @Input() fieldSubmitted?: boolean = false; //----------------- } ``` |Propriété|Type données|Description| |---|:---:|---| |**fieldForm**|[TFieldFormEditData](https://www.npmjs.com/package/sgc-share-lib#1-tfieldformeditdata)|Objet décrivant le champ/composant graphique à utiliser dans le formulaire| ## **Selector** ```html <sgc-ng-field-form-edit></sgc-ng-field-form-edit> ``` <br/> ## **Example** ```typescript //--- Declare and Init TFieldFormPasswordData variable class AppComponent implements OnInit { mysecret1!: TFieldFormEditData; ngOnInit() { this.mysecret1={...TFieldFormPasswordDataDefault, name:'password1', label: 'Mon champ Password 1', disabled:false, showLabel:true, hidePassword:true}; } } ``` ```html <!-- HTML --> <sgc-ng-field-form-edit [(fieldForm)]="mysecret1"></sgc-ng-field-form-edit> ```