dart - 如何在嵌套模板中查找元素

Question

聚合物元素定义如下:

<polymer-element name="my-element">
    <template>
       <template if="{{show==true}}">
           <div on-click="{{hideMe}}"> click to hide my div </div>
           <div id="mydiv">
               my div content here
           </div>
       </template>
     </template>
 </polymer-element>

而Dart的代码如下:

@CustomTag('my-element')
@observable bool show = true;

 hideMe(){
    Element e = $['mydiv'];
    e.hidden = true;
 }

代码不起作用，因为$ ['mydiv']返回null。
如何在Dart聚合物组件的嵌套模板中找到元素？

Answer 1

你为什么想这么做？ <template if时，show == false从DOM中删除节点。
您要做的就是

在HTML中

`on-click='{{hide}}'` 

在Dart中

void hide() {
  show = false;
}

如果您不想隐藏 <div on-click='...>，请将其移到 <template if=...>之外

暗示:
如果您的 show字段是bool类型，则可以简化为

 <template if="{{show}}">