Angularjs образует поля в гнездовой нг повтора

Question

Привета Я вложенное поле формы, как этот

<table> 

    <tbody ng-repeat="student in students">  
    <tr> 
    <td colspan="3">{{student.sname}}</td> 
    </tr> 
    <tr> 
    <td>Subject</td> 
    <td>External Mark</td> 
    <td>Internal Mark</td> 
    </tr> 

    <tr ng-repeat="subject in exam_subjects"> 
    <td>{{subject.subject_name}}</td> 
    <td><input ng-model="subject.student.external_mark"></td> 
    <td><input ng-model="subject.student.internal_mark"></td> 
    </tr> 

</tbody> 

</table> 

Это для сдачи экзамена марок предметов для студентов. Он отображается отлично, но когда я помещаю отметку в объект external_mark/internal_mark, все поля внешнего_марка/внутреннего_знака этого субъекта заполняются одинаковым значением. Как я могу справиться с этим? Благодарим за помощь и предложения.

Answer 1

Для ввода требуется уникальное имя в форме.

<tr ng-repeat="subject in exam_subjects"> 
    <td>{{subject.subject_name}}</td> 
    <td><input name="external_{{$index}}" ng-model="subject.student.external_mark"></td> 
    <td><input name="internal_{{$index}}" ng-model="subject.student.internal_mark"></td> 
    </tr> 

Answer 2

Идея состоит в том, чтобы сопоставить тематические мудрые темы каждого учащегося с уникальной переменной сферы. Для каждого ученика сохраняются массивы внешних и внутренних меток. я сделать ваши студенты объект похож на это:

$scope.students=[{ 
    "sname": "abc", 
    "marks": [] 
}]; 

$scope.exam_subjects=[{ 
    "id": "1", 
    "subject_name": "Physics" 
    }, 
    { 
    "id": "2", 
    "subject_name": "Maths" 
    }]; 

На ваш взгляд:

<tr ng-repeat="subject in exam_subjects"> 
<td>{{subject.subject_name}}</td> 
<td><input ng-model="student.marks[{{subject.id-1}}].external_mark"></td> 
<td><input ng-model="student.marks[{{subject.id-1}}].internal_mark"></td> 
</tr> 

код не проверяется. Это просто даст вам представление о том, как эта проблема может быть решена.

Answer 3

Ответ номер2. Теперь, когда я знаю, что вы делаете (что было сложно с первого поста), я бы рекомендовал вам что-то подобное.

ПРИМЕЧАНИЕ Оно будет работать только в том случае, если у вас есть отдельная функция PUT/PATCH для одного объекта.

exam_subjects должен быть массивом. в вашем контроллере как $ scope.exam_subjects. Когда вы нажимаете редактировать, сделайте это примерно так.

<tr ng-repeat-start="subject in exam_subjects"> 
... 
<td><button ng-click=onEdit(subject)></button></td> 
</tr> 
<tr ng-repeat-end="" ng-if="vm.selectedSubject.Id===subject.Id"> 
<td colspan=""> 
    //your form that you bind to selectedSubject. add submit and Cancel button. 
</td> 
</tr> 

в контроллере.

$scope.onEdit=function(subject){ 
    $scope.selectedSubject = angular.copy(subject); 
    //need to be a copy if you want to be able to Cancel post. Otherwise Angular will update array element directly 
} 
$scope.onCancel = function(); 
    $scope.selectedSubject=''; 
} 
$scope.onSubmit = function(subject){ 
//your submit code 
}