Как получить доступ к узлу пользовательского элемента

у меня есть пользовательский элемент, который сам содержит пользовательский элемент.

<polymer-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');

в Dart в attached() (после обращения к super.attached()) this.parent равно null и я не смог найти никакой другой ссылки на элемент host.

как я могу сделать это в Dart?

6
custom-controls dart dart-polymer polymer shadow-dom

2 ответов

к сожалению, порядок создания пользовательских элементов не гарантируется. Вижу полимерная.Дарт обсуждения и соответствующее обсуждение полимерные дискуссионные группы.

однако, как уже упоминалось, ваше конкретное использование нарушит инкапсуляцию и использование CustomEvents-это гораздо больше. И используя полимер это будет очень легким снабдить также.

<!-- flex_nonvisual.html file -->

<polymer-element name="flex-nonvisual">
  <template>
    <polymer-flex-layout on-ready="{{layoutReady}}"></polymer-flex-layout>
  </template>
</polymer-element>

// polymer_flex_layout.dart file

@CustomTag('polymer-flex-layout')
class PolymerFlexLayout extends PolymerElement {
  // other stuff here
  void attached() {
    super.attached();
    dispatchEvent(new CustomEvent('ready'));
  }
}

// flex_nonvisual.dart

@CustomTag('flex-nonvisual')
class FlexNonvisual extends PolymerElement {
  // Other stuff here
  void layoutReady(Event e, var details, Node node) {
    this.classes.add('someclass');
  }
}
7

обновление: полимер >=1.0.x

shady DOM

new PolymerDom(this).parentNode;

или

domHost

сокращенно 

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

полная тень DOM 

(this.parentNode as ShadowRoot).host

@ChristopheHerreman и @MattB по-прежнему правы относительно инкапсуляции не должны быть нарушены.

но также полимерные элементы JS получают доступ к родительским элементам в своих элементах макета, потому что это все еще удобно в некоторых вариант развития событий.

теперь это работает и в PolymerDart.

полимерная.dart 

(this.parentNode as ShadowRoot).host
6