# 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>
```