Polymer 根据CoreSelector的选定值更改聚合物模板中的输入字段

我有一个“添加内容”对话框，可以让你选择要添加的内容类型。基于此，我希望包括或排除某些字段

<core-selector id="content-type" target="{{$['types']}}" itemsSelector="li" valueattr="value" selected="other"></core-selector>
  <ul id="types" class="list">
    <li value="announcement">Announcement</li>
    <li value="event">Event</li>
  </ul>
</core-selector>

我正在收听内容类型选择器的更改：

attached() {
  CoreSelector type = $['content-type'];
  type.addEventListener('core-select', (e) {
    selectedType = type.selected;
  });
}

selectedType是可观察的：@observable var selectedType

在模板本身中，如果我这样做：

<template if="{{selectedType == 'event'}}">
  <!-- Show some additional fields here. -->
</template>

问题是，$不包含这些字段，因为在填充$时，模板被戳记时这些字段不存在

有什么更好的方法来处理这一切

---

我想到的是将所有表单字段分配给@observable映射的方法，如下所示：。对于我正在尝试做的事情，这是一种更好的方法吗？如果是的话，我将如何调整它？

我没有完全深入研究您的代码，但是当$因模板重复而无法工作时/if只使用shadowRoot.querySelector。你的问题有时有点过于宽泛了。@GünterZöchbauer，承认：我面临的许多挑战是这样的吗？诸如此类的事情。我觉得好像很多其他人都有这些更高层次的挑战，可以从答案中受益。我会努力做得更好。我不介意，但得到这些问题答案的机会很低，我只是想让你知道可能的原因。也许Dart谷歌小组是解决这类问题的好地方。

<template if="{{selectedType == 'event'}}">
  <!-- Show some additional fields here. -->
</template>