debugging controllers...

This commit is contained in:
Maria Teresa Paratore 2024-03-07 17:26:01 +01:00
parent 39e8d5ded1
commit 038368257a
2 changed files with 87 additions and 131 deletions

View File

@ -16,14 +16,15 @@
</mat-expansion-panel> </mat-expansion-panel>
<div [formGroup]="myForm"> <div [formGroup]="myForm">
<div formArrayName="facets">
<div *ngFor="let fct of typeSpec.facetSpecs; let ind=index;">
<div formArrayName="facetBlocks">
<div [formGroupName] ="ind" *ngFor="let fct of typeSpec.facetSpecs; let ind=index;" >
<mat-expansion-panel> <mat-expansion-panel>
<mat-expansion-panel-header> <mat-expansion-panel-header>
<mat-panel-title> <mat-panel-title>
<!--TODO: vedi quando si possono rendere editabili le relazioni--> <!--TODO: vedi quando si possono rendere editabili le relazioni-->
<input formControlName="relation" type="text" value="{{typeSpec.facetSpecs[ind].relation}}" [disabled]="true"/> <input formControlName="relation" type="text" value="{{typeSpec.facetSpecs[ind].relation}}" />
</mat-panel-title> </mat-panel-title>
<mat-panel-description> <mat-panel-description>
{{typeSpec.facetSpecs[ind].name}} {{typeSpec.facetSpecs[ind].name}}
@ -32,22 +33,10 @@
<p>{{typeSpec.facetSpecs[ind].description}}</p> <p>{{typeSpec.facetSpecs[ind].description}}</p>
<!-- OK SO FAR --> <!-- OK SO FAR -->
<div formArrayName="facetPropsBlock" style="border: 1px solid rgb(84, 193, 255); padding: 10px; margin: 5px;">
<p>group {{ind}}</p> <div [formGroupName] ="i" *ngFor="let prop of typeSpec.facetSpecs[ind].guiProps; let i=index" >
<div formArrayName="facetProps" style="border: 1px solid rgb(84, 193, 255); padding: 10px; margin: 5px;"> <label for="{{prop.name}}">{{i}}.{{prop.label}}</label>
<div formGroupName="ind"> <input formControlName="{{prop.name}}" id="{{prop.name}}" type="{{prop.type}}"/>
<!--
<div *ngFor="let student of studentsArray.controls; let i = index" [formGroupName]="i">
<input formControlName="firstName" placeholder="First Name">
<input formControlName="lastName" placeholder="Last Name">
<input formControlName="dob" placeholder="Date of Birth">
</div>
-->
<div *ngFor="let prop of typeSpec.facetSpecs[ind].guiProps; let i=index" >
<p> control {{i}} - <label>{{prop.label}}</label>
<input formControlName="i" type="{{prop.type}}"/>
</p>
</div>
</div> </div>
</div> </div>
@ -58,13 +47,8 @@
</div> </div>
</div> </div>
<!-- <button mat-button (click)="doAction()">Save Form</button> --> <!-- <button mat-button (click)="doAction()">Save Form</button> -->
<!--</form>--> <!--</form>-->
<!--fine form esterna--> <!--fine form esterna-->

View File

@ -33,7 +33,6 @@ export class FacetComposerComponent implements OnInit {
myForm: FormGroup ; //form complessiva myForm: FormGroup ; //form complessiva
typeSpec: ITypeSpecification; typeSpec: ITypeSpecification;
// eslint-disable-next-line @typescript-eslint/member-ordering // eslint-disable-next-line @typescript-eslint/member-ordering
@ -44,105 +43,78 @@ export class FacetComposerComponent implements OnInit {
this.titlePath = data.context.path; this.titlePath = data.context.path;
this.typeSpec = {} as ITypeSpecification; this.typeSpec = {} as ITypeSpecification;
/*
this.myForm = this.fb.group({ this.myForm = this.fb.group({
'facets': this.fb.array([]), 'facetBlocks': this.fb.array([
'facetPropsArray':this.fb.array([]),
});
*/
this.myForm = this.fb.group({
'facets': this.fb.array([
this.fb.group({ this.fb.group({
'relation':'', 'relation':'',
'facetPropsArray':this.fb.array([]), 'facetPropsBlock':this.fb.array([]),
//TODO: PROVA-> 'facetPropsBlock':this.fb.array([this.fb.group({}]),
}) })
]), ]),
}); });
}
/* get facetBlocks() {
segmentRows3: this.fb.array([ return this.myForm.get('facetBlocks') as FormArray;
this.fb.group({ }
segmentId3: '',
segmentTime3: '',
personRows3: this.fb.array([ get facetPropsBlock(): FormArray {
this.fb.group({ return this.myForm.get('facetPropsBlock') as FormArray;
personR3: '',
personI3: ''
})
])
})
]),
*/
} }
/* /*
Cannot find control with path addFacetBlocks() {
*/
get Facets(): FormArray {
return this.myForm.get('facets') as FormArray;
}
get FacetPropsArray(): FormArray {
return this.myForm.get('facetPropsArray') as FormArray;
}
addFacets() {
const fc = {} as IFacetComposer; const fc = {} as IFacetComposer;
this.facets.push(this.fb.group(fc)); this.facetBlocks.push(this.fb.group(fc));
} }
addFacetProps() { addFacetProps() {
const fp = {} as IFacetProps; const fp = {} as IFacetProps;
this.facetPropsArray.push(this.fb.group(fp)); this.facetPropsBlock.push(this.fb.control(fp));
} }
*/
ngOnInit(): void { ngOnInit(): void {
alert("facetPropsBlock");
alert(this.facetPropsBlock);
this.guiService.getFormStructure(this.titlePath,this.titleType).subscribe(res => { this.guiService.getFormStructure(this.titlePath,this.titleType).subscribe(res => {
this.typeSpec = res; this.typeSpec = res;
this.prepareEnvironment(res); this.prepareControls(res);
}); });
} }
prepareEnvironment(spec:ITypeSpecification){ prepareControls(spec:ITypeSpecification){
for (let ind = 0; ind < spec.facetSpecs.length; ind++) { for (let i=0; i<spec.facetSpecs.length; i++){
//TODO: metti a posto validazione this.facetBlocks.push(this.fb.group({
//this.fb.group() 'relation': [spec.facetSpecs[i].relation,Validators.required]
const itemExt = this.fb.control({ }));
relation: [spec.facetSpecs[ind].relation,null]
});
const fGroup: FormGroup = new FormGroup({}); for(let j=0; j<spec.facetSpecs[i].guiProps.length; j++){
let ctrl: FormControl|undefined; const props = spec.facetSpecs[i].guiProps[j];
for(let j=0; j<spec.facetSpecs[ind].guiProps.length; j++){ alert(this.facetPropsBlock);
const item = spec.facetSpecs[ind].guiProps[j]; //const name = props.name;
if(item.validations.length===0){ if(props.validations.length===0){
ctrl = this.fb.control({ this.facetPropsBlock.push(
name: ['',null] this.fb.control({
}); j : ['',null]
})
);
}else{ }else{
ctrl = this.fb.control({ this.facetPropsBlock.push(
name: ['',Validators.required] this.fb.control({
}); j : ['',Validators.required],
})
);
} }
fGroup.addControl('',ctrl); //AGGIUNGO FORMCONTROL AL FORMGROUP
} }
this.FacetPropsArray.push(fGroup); //AGGIUNGO FORMGROUP PER LA FACET this.facetBlocks.push(this.facetPropsBlock);
} }
} }
get facets() {
return this.myForm.get('facets') as FormArray;
}
// eslint-disable-next-line @typescript-eslint/adjacent-overload-signatures
get facetPropsArray(){
return this.myForm.get('facetPropsArray') as FormArray;
}
close():void { close():void {
this.dialogRef.close({event:'cancel'}); this.dialogRef.close({event:'cancel'});