Question

我有这个数据

   let data =   [
            {
                "number": 1,
                "answer": "FIRE SAFETY: Ensure Fire Extinguishers are full. Check daily by looking at the needle in the gauge.",

            },
            {
                "number": 2,
                "answer": "SECURITY: CP collects the keys from designated holder behind the Till before going outside.",

            },
            {
                "number": 3,
                "answer": "VERIFICATION: Recheck the ullage reading with the Driver just prior to going outside.",

            }
        ]

并手动添加了disable属性以禁用错误的

 this.data.map(function (answer){
  answer['disable'] = false;
});

这是我父母的孩子，这是我的父母

<child [answers]=data (clicked)="onClicked($event)"></child>
<button (clicked)="submit()">submit</button>

这是我的父组件：

onClicked(answer: InstructionAnswer) {
  this.selectedAnswer = answer;
}

submit(){
   this.data.find(a => a.number == this.selectedAnswer.number).disable = true;
}

点击子组件后，我将使用EventEmitter在父组件中选择答案

这是我的孩子部分：

<mat-list id="instruction-list">
<mat-list-item matRipple  class="list-item-instruction pointer" *ngFor="let answer of answers;let i=index;"
  (click)="setInstruction(answer,i)" [ngClass]="{'list-item-selected': (i==selectedInstruction && !answer.disabled),'list-item-instruction--disabled':(answer.disabled) }">
  <div>
    {{answer.answer}} 
  </div>
</mat-list-item>

setInstruction(answer, i) {
this.selectedAsnswer = answer;
this.selectedInstruction = i;
this.instruction = answer.answer;
this.clicked.emit(answer);

}

问题

当用户从子组件中选择答案时，我会在父组件中获取数据，然后单击父组件的提交按钮，我将知道哪个答案正确，现在我想禁用子组件中的错误答案。尝试很多方法，但是没有用，所以有人可以告诉我该怎么做。

单击父组件按钮

0 个答案: