Data binding Dart聚合物:从列表中删除元素

Data binding Dart聚合物:从列表中删除元素,data-binding,dart,polymer,dart-polymer,Data Binding,Dart,Polymer,Dart Polymer,我有一些模型的自定义元素。下面是自定义元素的代码 message-element.html <polymer-element name="message-element" attributes="message"> <template> <table class="table"> <tr template repeat="{{attrib in attribs}}"> <td><paper-inp

我有一些模型的自定义元素。下面是自定义元素的代码

message-element.html

<polymer-element name="message-element" attributes="message">
  <template>

    <table class="table">
    <tr template repeat="{{attrib in attribs}}">
      <td><paper-input name="message-attrib-name" label="New Attribute" value="{{attrib.name}}"></paper-input></td>
      <td>
        <paper-input name="message-attrib-value" label="" value="{{attrib.value}}"></paper-input>

        <core-icon-button icon="check" on-tap="{{addAttribute}}"></core-icon-button>
        <core-icon-button icon="highlight-remove" on-tap="{{deleteAttribute}}"></core-icon-button>
      </td>
    </tr>
    </table>

  </template>

  <script type="application/dart" src="message-element.dart"></script>
</polymer-element>

message-element.dart

@CustomTag('message-element')
class MessageElement extends PolymerElement with Observable {
  @published Message message;
  @observable List<Attribute> attribs = toObservable([]);
  @observable Attribute att;

  /// Constructor used to create instance of MainApp.
  MessageElement.created() : super.created() {
    polymerCreated();
  }

  attached() {
    att = new Attribute('', '');
    attribs.add(att);
    message.attributes = attribs; // initialize with 1 attrib
  }

  void addAttribute(Event event, Object detail, Node sender) {
    att = new Attribute('', '');
    attribs.add(att);
  }

  void deleteAttribute(Event event, Object detail, Node sender) {
    // remove the clicked attrib
  }
}
@CustomTag('message-element'))
类MessageElement使用Observable扩展了聚合关系{
@发布消息;
@可观察列表属性=toObservable([]);
@可观测属性att;
///用于创建MainApp实例的构造函数。
MessageElement.created():super.created(){
聚合处理();
}
附({
att=新属性(“”,”);
属性添加(附件);
message.attributes=attribs;//使用1 attrib初始化
}
void addAttribute(事件、对象详细信息、节点发送方){
att=新属性(“”,”);
属性添加(附件);
}
void deleteAttribute(事件、对象详细信息、节点发送方){
//删除单击的属性
}
}

attribs显示在模式对话框中,attribs中的每个attrib都有带有添加和删除按钮的耦合输入。添加元素工作正常。如何从属性库中删除单击的属性库。我在点击删除按钮时调用voiddeleteattribute(事件、对象细节、节点发送者)。在本次通话中,我需要从列表中删除attrib,但我如何获取已点击attrib的详细信息,以便从列表中删除该attrib。

Polymer>=1.0.0

@reflectable
void someClickHandler(dom.Event event, [_]) {
  // for native events (like on-click)
  var model = new DomRepeatModel.fromEvent(event);
  // or for custom events (like on-tap, works also for native events)
  var model = new DomRepeatModel.fromEvent(convertToJs(event));
  var value = model.jsElement['items']; 
  // or 
  var value = model.jsElement[$['mylist'].attributes['as']];
  // if you used the `as="somename"` 
  // in your <core-list> or <template is="dom-repeat">
}

有关更多详细信息,请参阅。

这给了我以下警告:var value=ti.model.value as-Inner“名称'Inner'不是一个类型,不能用于'as'表达式'OK很好,现在工作正常。但我不明白。你能给我一些建议让我深入了解它吗。我仍在学习Dart和聚合物,如果您能给我提供快速深入学习的链接,我将不胜感激。谢谢你的帮助。很抱歉,我没有链接,这些“高级”的东西还没有很好的文档记录。Polymer所做的是,为它创建的每个节点分配一个Expando(),动态地持有对模型实例(在您的案例中是属性)的引用,并使用我的答案中的代码,从随事件传递的节点获取引用的模型实例在那里我有时会发现一些有趣的作品。还有polymer.js的StackOverflow上的[polymer]标记。几乎所有在Polymer.js中工作的东西都可以以某种方式转换为Dart。我确信当聚合物稳定(1.0)时,文档将变得更好