У меня есть несколько текстовых полей, которые заполняются при вводе одного - PullRequest
0 голосов
/ 23 января 2019

Я создаю динамическую форму, которая позволяет пользователям указывать, какими могут быть вопросы и количество их, которые хранятся в коллекции Google Firestore.Когда я заполняю один текстовый блок, остальные заполняются одним и тем же.

html файл: создает формы и использует модуль угловых форм.Добавить элемент

  <ul *ngFor="let question of questions">
    <li><strong>{{question.name}}</strong>
      <input type="text" placeholder="Add Title" [(ngModel)] = 'answer.name' name = "title">
    </li>
  </ul>

  <input type="submit" value = "Submit" class = "btn">
</form>

ts файл: ts-файл получает данные из службы данных и передает их в html.

@Component({
  selector: 'app-add-item',
  templateUrl: './add-item.component.html',
  styleUrls: ['./add-item.component.scss']
})
export class AddItemComponent implements OnInit {
  questions: Question[];
  items: Item[];
  answers: Answer[];
  answer: Answer = {
    name:'',
    number:0

  }
  item: Item = {
    title:'',
    description:'',

  }
  question: Question = {
    name:'',
    number:null,
    answer:'',
  }
  database;
  doc:'';


  constructor(private dataService: DataService, private route: ActivatedRoute) { 
    this.route.params.subscribe(params => this.doc = params["id"])

  }

  ngOnInit() {
    this.dataService.getQuestions(this.doc).subscribe(questions => {
      this.questions = questions;
    })
  }
  onSubmit(){
{
  if(this.answer.name != ''){
    console.log(this.answer.name)
    this.dataService.addAnswer(this.answer);
    this.answer.name = "";


    }


  }

}}

Предполагается, что текстовые поля будут заполняться отдельно, и я могузапишите их данные.

На самом деле все текстовые поля заполняются одновременно.

Ответы [ 2 ]

0 голосов
/ 23 января 2019

<ul *ngFor="let question of questions"><li><strong>{{question.name}}</strong><input type="text" placeholder="Add Title" [(ngModel)] = 'question.answer' name =title[]></li>

0 голосов
/ 23 января 2019

Следующим способом вы можете получить отдельное значение из текстовых полей

 <ul *ngFor="let question of questions">
<li><strong>{{question.name}}</strong>
  <input type="text" placeholder="Add Title" [(ngModel)] = 'question.answer' name = "title">
</li>

...