如何更改Aurelia中输入字段的可见性？

Question

我在奥里利亚有以下表格。在表单的顶部，有一个下拉菜单来选择用户类型。只有两种选择。当用户更改类型时，我需要显示和隐藏一些输入字段。

I.E：当用户选择＆＃39; Producer＆＃39;时，我需要隐藏用户名。当用户选择＆＃39; Writer＆＃39; ，我需要显示用户名并隐藏电子邮件地址。像这样。需要使用JavaScript控制器执行此操作。

https://gist.github.com/chanakaDe/75934983cb4a02a7a8914959e38bf0f3

这是HTML代码作为github要点。请给我一个解决方案。

Answer 1

您可以使用show.bind（如果您只想显示和隐藏元素），或if.bind（如果您想从DOM添加和删除它）。例如：

<div class="form-group" id="div_username" if.bind="user_type === 'writer'">
  <label for="userame">Username:</label>
  <input type="text" class="form-control" id="userame" value.bind="userame" placeholder="Userame">
</div>

可运行示例https://gist.run/?id=33db6b8f919eb95d63b8bfbc2e912fe5 - 将用户类型更改为＆＃39; writer＆＃39;并且您将看到用户名输入。