aurelia - 在选择特定单选按钮时禁用选项卡

Question

我总共有 6 个选项卡。每个选项卡都有自己的内容。在选项卡 6 上有两个单选框

1- 自动（单选按钮）在此单选框下有 5 个复选框，其中每个复选框上都提到了选项卡名称。

2- 手动

现在我想要如果我选择“自动”选项，那么所有选项卡都应该禁用，并且所有复选框都应该在单选按钮下选择。

如果我选择选项 2“手动”，那么所有选项卡都应该启用。

Answer 1

这是您想要的示例https://codesandbox.io/s/88vv14qwwj

我使用了： - Bootstrap 选项卡，便于造型 - 3 个选项卡可减少噪音

它归结为在选项卡按钮上设置禁用的逻辑，以及如何<input type=radio>在最后一个选项卡中创建。你只需要确保他们有正确的组合来禁用你需要的东西。

在示例中，我做了：disabled.bind="isAutomatic && !tab.disabled"

这意味着只有在自动模式下禁用选项卡按钮并且最后一个选项卡面板中的选项卡复选框尚未选中，因为最后一个面板中的复选框绑定到 tab.disabled您的应用程序tabs数组中。