如何访问自定义元素的主机 [英] How can I access the host of a custom element

问题描述

我有一个自定义元素，它本身包含一个自定义元素。

  element name =flex-nonvisual> 
< template> 
< polymer-flex-layout>< / polymer-flex-layout> 
< / template> 
< / polymer-element> 
  

现在在 attached（）其他回调） PolymerFlexLayout 我想设置 flex-nonvisual 元素的类属性。

在Javascript中，代码看起来像 this.parentNode.host.classList.add（'someclass'）;

在 super.attached（）中调用 attached（） >） this.parent 为null
，我找不到对主机元素的任何其他引用。

如何在Dart中执行此操作？

解决方案

update：Polymer> = 1.0.x

阴影DOM

  PolymerDom（this）.parentNode; 
  

或

  domHost 
  

的简写

  Polymer.dom（this）.getOwnerRoot（）。host 
  

full shadow DOM

 （this.parentNode为ShadowRoot）.host 
  





---

@ChristopheHerreman和@MattB仍然是正确的封装不应该打破。 / p>

但是JS Polymer元素在布局元素中访问父元素，因为在某些情况下它仍然很方便。

$ b b
$ b

 （this.parentNode为ShadowRoot）.host 
  

I have a custom element which itself hosts a custom element.

<polymer-element name="flex-nonvisual">
  <template>
    <polymer-flex-layout></polymer-flex-layout>
  </template>
</polymer-element>

Now in attached() (or some other callback) of PolymerFlexLayout I want to set the class attribute of the flex-nonvisual element.

In Javascript the code looks like this.parentNode.host.classList.add('someclass');

In Dart in attached() (after the call to super.attached()) this.parent is null and I couldn't find any other reference to the host element.

How can I do this in Dart?

解决方案

update: Polymer >=1.0.x

shady DOM

new PolymerDom(this).parentNode;

or

domHost

short for

Polymer.dom(this).getOwnerRoot().host   

full shadow DOM

(this.parentNode as ShadowRoot).host

---

@ChristopheHerreman and @MattB are still right about encapsulation should not be broken.

But also JS Polymer elements access the parent in their layout elements because it's still convenient in some scenarios.

This works now in PolymerDart too.

Polymer.dart <= 0.16.x

(this.parentNode as ShadowRoot).host

这篇关于如何访问自定义元素的主机的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！