Проверка группы переключателей в angular cli - PullRequest
0 голосов
/ 01 марта 2020

Я пытался проверить кнопку на каждой группе переключателей в angular, используя ngFor, и она работает только в последней группе l oop, т.е. проверяется только кнопка в последней группе переключателей. Как сделать кнопку на каждой группе радиостанций l oop, чтобы ее проверяли? Это код ниже. Я использую Angular 8

html файл

<form >
  <div class="row px-5">
    <div class="col-sm-12 col-md-4 px-4" *ngFor="let data of myData">
        <input class="form-control mt-3" type="text"  value="{{data.name}}" name="name" />

        <div *ngFor="let status of accessorStatus">
             <input class="" type="radio" name="statuses" [value]="status" [(ngModel)]="data.status"/><span class="text-white ctrl-font ml-2">{{status}}</span>
         </div>
    </div>
    <div class="text-right py-5">
       <button  class="save-btn py-3 px-5 ml-4 mr-5" type="submit" (click)="saveUpdate()">save</button> 
    </div>
</form>

файл

import { Component, OnInit } from "@angular/core";
import { PortalService } from '../portal.service';
import { ActivatedRoute, Router } from '@angular/router';
import { FormBuilder, FormArray, FormGroup } from '@angular/forms';

@Component({
    templateUrl: './edit-candidate.component.html',
    styleUrls: ['./edit.component.css']
})

export class EditComponent implements OnInit{

    public candidate
    public accessors = [];
    public accessorStatus = [
        'sent', 'received', 'accepted', 'disproved'
    ];

    constructor(private portalService: PortalService,
        private route : ActivatedRoute, private fb: FormBuilder,
        private router : Router
        ){
    }

    ngOnInit(){

        this.getCandidate(this.route.snapshot.params['id']) 
    }

    getCandidate(id){
        this.portalService.getCandidate(id)
        .subscribe((data) => {
            this.candidate = data;
            data.accessor.map(item => {
                this.accessors.push(item);
            });
        })
    }
    saveUpdate(){
        let id = this.route.snapshot.paramMap.get('id')
    this.portalService.updateCandidate(id, this.accessors).subscribe((data)=> {
        this.router.navigate(['candidate-list'])
        console.log(data)
    })        
    }
}

1 Ответ

0 голосов
/ 01 марта 2020

Вам нужно дать другое имя для каждого "данных". добавьте let i = index во внешнюю l oop и используйте [name] = "'statuses' + i"

<div *ngFor="let data of myData;let i=index">
    ...
    <div *ngFor="let status of accessorStatus">
       <input class="" type="radio" [name]="'statuses'+i" [value]="status" ...>
   </div>
</div>
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...