Question

这是面临的确切错误：

QuizComponent.html：11错误错误：没有表单控件的值访问器名称：＆＃39; s＆＃39;

我尝试使用JSON创建一个包含4个选项（按钮）的测验应用程序。用户提供的答案与点击Next按钮时提供的JSON答案进行比较。我已经看过了关于这个错误要求使用表单的其他搜索结果，但由于我没有创建任何具有明确输入但只是简单的按钮值的内容，我想不应该使用表单。

PS：在我为HTML测验选项实现可点击按钮之前，此代码运行正常。我之前正在使用单选按钮。对于ngModel双向绑定有问题，并且我不确定它是什么，因为如果我从按钮中删除ngModel标记，HTML代码会正确显示，否则如果我在其中写入ngModel则不显示按钮。

HTML：

 <div *ngFor="let actiVar of activeArray ;let j = index">

        {{actiVar.QuestionID}}.{{actiVar.Question}}
        <br>
        <br>

        <button type="button" name="s" id="oneans" [(ngModel)]="hello" [value]="actiVar.OP[j+0]" [disabled]="permission">{{actiVar.OP[j+0]}}</button>
        <br>
        <br>
        <button type="button" name="s" id="oneans" [(ngModel)]="hello" [value]="actiVar.OP[j+1]" [disabled]="permission">{{actiVar.OP[j+1]}}</button>        <br>
        <br>
        <button type="button" name="s" id="oneans" [(ngModel)]="hello" [value]="actiVar.OP[j+2]" [disabled]="permission">{{actiVar.OP[j+2]}}</button>        <br>
        <br>
        <button type="button" name="s" id="oneans" [(ngModel)]="hello" [value]="actiVar.OP[j+3]" [disabled]="permission">{{actiVar.OP[j+3]}}</button>
        <br>
      </div>
<button type="button" class="btn btn-light" id="button1" *ngIf="this.fLoop != this.questArray.length" (click)="filterAnswer(hello)">Next</button>

.TS：

filterAnswer(i: any) //Comparing Answer submitted by user with JSON provided answer
  {
    this.correctAns = this.activeArray[0].isRight;
    this.lastIndex = this.activeArray[0].QuestionID;
    if (this.correctAns == i && this.correctAns != this.storeArray[this.storeCounter - 1]) {
       console.log(i);

      this.storeArray[this.storeCounter] = i; //Only the correct answer provided by user gets stored here.
      this.storeCounter++;

      this.scoreCounter++;
}
    }

Answer 1

我不会在按钮上使用ngModel。使用简单（单击）事件并将数据存储在变量中。做这样的事情：

<button type="button" name="s" id="oneans" [disabled]="permission" (click)="getUsersAnswer(actiCar,OP[j+0])">{{actiVar.OP[j+0]}}</button>

并在.ts文件中将该值存储在某个变量中：

getUsersAnswer(answer: any) {
   this.i = answer;
}

没有名称的表单控件的值访问器 - Angular 5

1 个答案: