У меня есть вложенный массив. Я хочу отредактировать значения в своей форме, поэтому я сделал запрос к БД, чтобы получить значения для редактирования, но я не могу поместить их (значения personRows3) в правое поле ввода. personRows3 - это вложенный массив форм, который имеет одну или несколько групп форм (personI3, personR3), см. seg_inf ниже.
Я получаю сообщение об ошибке: Error: Cannot find control with path: 'segmentRows3 -> 0 '
Вот код .html
<form *ngIf = "row" [formGroup] = "myEditSummaryForm" (ngSubmit) = "saveASummary(myEditSummaryForm.value)">
<div class = "container">
<div formArrayName = "segmentRows3">
<div *ngFor = " let seg of seg_inf; let i= index " >
<div class = "form-group" [formGroupName] = "i" > <---error line----
<label for = "segmentId3">Segment ID {{i+1}}
<input type = "text" formControlName = "segmentId3" id = "segmentId3" class = "form-control" value = "{{i+1}}" >
</label>
<label><span *ngIf = "seg_inf.length > 1" (click) = "deleteSegment(i)" class = "btn btn-danger">Remove segment</span></label>
<label for = "segmentTime3">Segment time :
<timepicker formControlName = "segmentTime3" (ngModel) = "segmentTime3" [showMeridian] = "isMeridian" [showSpinners] = "showSpinners"> </timepicker> </label>
<button type = "button" (click) = "addPerson(i)" class = "btn btn-info">Add a person</button>
{{seg.personRows3 |json}}<br>
<div formArrayName = "personRows3">
<div *ngFor = " let per of seg.personRows3; let j=index " >
<div class = "form-group" [formGroupName] = "j"> #{{j+1}}
<label for = "personR3">Segment type
<input formControlName = "personR3" [typeahead] = "personRole" type = "text" id = "personR3" class = "form-control">
</label>
<label for = "personI3">Person name
<input formControlName = "personI3" [typeahead] = "states" type = "text" id = "personI3" class = "form-control">
</label>
<label><span *ngIf = "seg_inf.length > 1" (click) = "deletePerson(i,j)" class = "btn btn-warning">Remove</span></label>
</div>
</div>
</div>
<label for = "topic">Topic</label>
<textarea formControlName = "topic" id = "topic" class = "form-control" (ngModelChange) = "onChange($event)"></textarea>
</div>
</div>
</div>
<button type = "button" (click) = "addSegment(i)" class = "btn btn-primary">Add a segment</button>
</div>
<div>
<button class = "btn btn-success form-control"
(click) = "saveASummary(myEditSummaryForm.value)"> Save update(s)</button>
</div>
</form>
Вот код .ts
for (var i = 0, len = this.seg_inf.length; i < len; i++) {
let segmentRows3 = <FormArray>this.myEditSummaryForm.get('segmentRows3');
segmentRows3.push(
this.fb.group({
segmentTime3: this.seg_inf[i].segmentTime3,
segmentId3: i+1,
topic: this.seg_inf[i].topic,
PersonRows3: this.getPerson(this.seg_inf, i), //function call
})
);
}
getPerson(s_i: any[], index: number) {
let s_i_prl = s_i[index].personRows3.length;
let s_i_pr = s_i[index].personRows3;
// get all people for that segment
for (var j = 0, lenj=s_i_prl; j < lenj; j++) {
let personRows3 = <FormArray>this.myEditSummaryForm.get(`segmentRows3.${index}.personRows3`)
this.fb.array([
this.fb.group({
personR3: s_i_pr[j].personR3,
personI3: s_i_pr[j].personI3,
})
])
}
}
this.seg_inf = [{"segmentTime3":"2018-05-23T14:20:00.051Z","segmentId3":"","topic":"topic1",
"personRows3":[{"personR3":"HS - host","personI3":"California"},{"personR3":"GS - guest","personI3":"Alaska"}]},
{"segmentTime3":"2018-05-23T14:30:00.533Z","segmentId3":"","topic":"topic2",
"personRows3":[{"personR3":"HS - host","personI3":"Arizona"}]}]
Все работает, пока я не попробую заполнить поля ввода для personRows3!
Вы можете увидеть: {{seg.personRows3 |json}} после Add a person button
Вот нерабочий код. Что мне не хватает?



![Безумие обратных вызовов в javascript [JS]](https://i.imgur.com/WsjO6zJb.png)


Это не должно быть так сложно, как в вашем методе getPerson, который на самом деле не что-то возвращает.
Вы можете использовать следующий код:
personRows3: this.getPerson(this.seg_inf[i].personRows3);
...
getPerson(personRows: any[]) {
return this.fb.array(
personRows.map(p => this.fb.group({
personR3: p.personR3,
personI3: p.personI3,
})
))
}
Здесь я возвращаю FormArray из FormGroups, которые основаны на вашем массиве personRows3.
Вы также можете проверить это в Пример ng-run
Вы можете проверить это? stackblitz.com/edit/…
Не вижу разницы. Вы можете взглянуть на это: stackblitz.com/edit/…, это все приложение! вы увидите ошибку в консоли Error: Cannot find control with path: 'segmentRows3 -> 0 -> personRows3' Спасибо
Первая буква в пersonRows3 должна быть в нижнем регистре.
См. Комментарий, начинающийся с yurzuistackblitz.com/edit/angular-4bvapp?file=src/app/…
ты можешь помочь с этим? stackoverflow.com/questions/50399557/… спасибо.
Большое спасибо за Вашу помощь. но я получаю еще одну ошибку:
Error: Cannot find control with path: 'segmentRows3 -> 0 -> personRows3', и он не зацикливается на personRows3, см. изображение, о котором идет речь. Спасибо