Angular

Question

这是一个测验应用程序，在这种情况下，我的下一个按钮将重定向到另一个页面并且默认情况下它是禁用的。 如果我选择了它应该启用的所有选项。

注意：

我选择选项和选择 correct/wrong 的功能工作正常，我只是想不通在选择每个选项时如何启用。

buttonDisabled = true;

<button class="btn-next" [disabled]="buttonDisabled">
  Next
</button>

Answer 1

你可以使用 Object.keys，像这样

App.component.html

<button class="btn-next" [disabled]="isDisabled()">
    Next
  </button>

app.component.ts

isDisabled(): boolean {
  return Object.keys(this.answerEvaluation).length !== Object.keys(this.practiceQuizData).length;
}

Answer 2

答案会奏效，但您可以按照此处显示的 Angular 方式进行设置：

有两种方法：模板驱动或反应形式

然后你可以绑定disabled 属性到form valid 属性.

选择最适合您需求的选项。希望对你有帮助。

Answer 3

我对此的看法是将 buttonDisabled 定义为 getter，然后评估每个问题的状态是否允许导航到下一页...

在我的实现中，用户必须 select 回答所有类型 2 问题，但只回答一个类型 1 问题。如果这不是您想要的，请在评论中说明，这对我来说是合乎逻辑的。希望对您有所帮助。

有什么问题吗？随便问问。

Angular - 检查是否选择了所有选项以启用按钮