Попробуйте установить начальное значение для привязки. В разметке Angular вы используете
[(ngModel)]="item.modifType"
. Вы определяете items
как любой объект и modifType
как любой, но вы не указываете modifType
как фактическое свойство item
.
Скорее, в разметке используйте следующее:
<div class="card-body">
<div *ngFor="let item of items; let i = index">
<input type="radio" id="{{ item.id }}" name="modifType" value="ModifType Value" [(ngModel)]="item.modifType" (change)="radioChecked( item.id, i )">
<label class="form-check-label"> {{ item.modifType }} </label>
</div>
</div>
И в компоненте используйте следующее. Обратите внимание на добавленный modifType
в определении items
, что делает его массивом для итерации, устанавливает значение, соответствующее свойству value в вашей разметке, а затем комментирует следующую строку modifType
.
Поскольку вы указываете значение item.modifType
, он сообщает Angular, который выбирается с самого начала. Кроме того, поскольку вы использовали значение item.modifType
, это вызывает круговое l oop (что-то должно предоставлять значение для item.modifType
, и оно не может быть просто текущим неинициализированным значением или останется таковым) .
Вы аналогичным образом ссылаетесь на item.id
в разметке, но на самом деле нигде не определяете это, но, предположительно, это может быть заполнено в остальной части кода, который вы оставили неопубликованным.
export class ModifComponent implements OnInit {
items: any[] = [{ ErrorDesc: '0', modifType: 'ModifType Value' }];
error = false;
msgError: string;
//modifType: any;
sModifType() {
this._sharedService.sModifType().subscribe(
(response: any) => {
if (response.Status === 'success' || response.StatusMessage === 'success') {
this.items = JSON.parse(response.Data);
} else if (response.Status === 'error' || response.StatusMessage === 'error') {
this.items = { ErrorDesc: response.Message };
this._sharedService.saveError(response.Data, 20, 'modification').subscribe((data2: any) => {
console.log(data2);
});
}
},
(error: any) => {
this.items = { ErrorDesc: error };
this.msgError = error.message;
}
);
}
}