How to get value of FormControl in angular2
I have the following Form with a FormArray containing FormGroups
<form [formGroup]="screenForm" novalidate>
<div formArrayName="iPhoneScreenshots" class="row">
<div *ngIf="screenForm.controls.iPhoneScreenshots?.length > 0">
{{screenForm.controls.iPhoneScreenshots?.length }}
<div *ngFor="let url of screenForm.controls.iPhoneScreenshots.controls; let i=index">
<div [formGroupName]="i">
<input class="form-control" formControlName="url">
<img src="{{app.screenshotUrls[i]}}" class="rounded img-fluid app-screen" style="height:200px"/>
</div>
</div>
</div>
</div>
</form>
the url values ββcome from an array that is filled through the API in the callback I set the values:
private setScreenShots(app: ItunesApp): void {
if (app.hasOwnProperty('screenshotUrls')) {
const screenShots = app.screenshotUrls.map(url => {
return this.fb.group({
url: [url, Validators.required]
});
}
);
const screenShotsArray = this.fb.array(screenShots);
this.screenForm.setControl('iPhoneScreenshots', screenShotsArray);
}
}
initial array is empty
private createForm() {
this.appSiteForm = this.fb.group({
title: ['', Validators.required]
});
this.screenForm = this.fb.group({
iPhoneScreenshots: this.fb.array([]),
});
}
this line of code looks very strange to me
img src="{{app.screenshotUrls[i]}}"
I am doing this because url.value () or url.get ('value') throws errors.
So how can I access the value of a form control?
+3
source to share