Dart передает данные динамически созданному полимерному элементу

Я прочитал этот поток о том, как передать данные полимерному элементу Нажатие кнопки в полимерном дротике не работает; нужен полимерный элемент

Но, тем не менее, если я хочу передать данные программно созданному элементу с помощью createElement() в полимере. dart, шаблона упаковки нет. Как я буду передавать данные, как указано выше?

Кстати, несмотря на то, что я считаю дартс действительно классным языком (мне не нравится JavaScript), я обнаружил, что полимер в дарте, возможно, еще не готов. Многое не задокументировано и приходится ходить по примерам или спрашивать здесь.

Спасибо, Йи


person yi chen    schedule 24.09.2013    source источник


Ответы (3)


Я думаю, вам следует удалить функцию start() из класса MyElementElement и добавить ее на верхний уровень. По сути, у вас не должно быть никаких ссылок в пользовательском элементе на объекты верхнего уровня. Теперь пользовательский элемент нельзя использовать повторно, он работает только в этом контексте.

person grohjy    schedule 25.09.2013

Я долго искал, но все работает. У меня работает только одно решение: https://stackoverflow.com/a/20067111/189411

person Domenico Monaco    schedule 10.07.2014

Вот мой пример того, как я передал данные в динамически созданный пользовательский полимерный элемент. Мое намерение состояло в том, чтобы щелкнуть «a href» и загрузить полимерный элемент в контейнер div.

полимер_элемент.html

<polymer-element name="my-element">
  <template bind>
    <p> {{ mytext }} </p>
  </template>
  <script type="application/dart" src="polymer_myelement.dart"></script>
</polymer-element>

polymor_element.dart

import 'dart:html';
import 'package:polymer/polymer.dart';
import 'package:custom_element/custom_element.dart';

@CustomTag('polymer-myelement')
class MyElementElement extends PolymerElement with ObservableMixin {

  bool get applyAuthorStyles => true;

  @observable String mytext = "initial text";

  void start() {

    query('#a href to click').onClick.listen((MouseEvent event){
      query('.container').children.clear();
      var myElem = createElement('polymer-myelement');

      MyElementElement myel = myElem.xtag;
      myel.mytext = "i changed the text now or import w/e you want";

      query('.container').children.add(myElem);

    });    
  }
}

main() {
  MyElementElement el = new MyElementElement();
  el.start();
}

index.html

<head>
  <link rel="import" href="polymer_myelement.html">
  and everything you need ...
</head>
<body>
  <a href to click>click me for new text</a>
  <div class="container">
  <!-- START OF MAINCONTAINER -->

  <!-- END OF MAINCONTAINER -->
  </div>
</body>

Итак, вот объяснение: в моем main() я просто запускаю свою функцию start() и устанавливаю onclickListener для моей навигационной панели href. Когда я нажимаю на свой href сейчас, я просто очищаю все дочерние элементы в моем «div class = «container», потому что я всегда хочу очистить div, прежде чем вставлять свои полимерные элементы. Теперь создайте полимерный элемент с помощью «createElement('polymer- mylement');". Создайте объект MyElement и назначьте ему полимерный элемент "xtag". Теперь у вас есть доступ ко всем свойствам и вы можете их изменять. Просто добавьте созданный элемент в свой div, и все готово.

Вы только что динамически создали полимер-элемент, присвоили ему свои новые данные и видите их в своем index.html

person user1878514    schedule 24.09.2013
comment
Спасибо. Это работает. Мне любопытно, это документирует где-нибудь? - person yi chen; 25.09.2013