如何访问子元素的附加行为？答案

【问题标题】：How to access sub element's attached behavior?如何访问子元素的附加行为？
【发布时间】：2018-03-11 20:37:41
【问题描述】：

我正在尝试为 https://github.com/RubaXa/Sortable 编写一个附加的 aurelia 行为，它允许使用 html 5 拖放对列表中的项目进行重新排序，类似于它们在 AngularJS 中的应用。到目前为止，html 元素的拖放与以下模板代码完美配合

<template>
  <require from="./sortable"></require>
  <section>
    <h2>${title}</h2>
    <ul sortable>
      <li repeat.for="item of items">${item.title}</li>
    </ul>
  </section>
</template>

和附加行为

import {Behavior} from 'aurelia-framework';
import Sortable from 'rubaxa-sortable';

export class SortableAttachedBehavior {
  static metadata() {
    return Behavior
      .attachedBehavior('sortable');
  }

  static inject() {
    return [Element];
  }

  constructor(element) {
    this.element = element;
  }

  bind(viewModel) {
    this.sortable = Sortable.create(this.element);
  }

  unbind() {
    this.sortable.destroy();
    this.sortable = null;
  }
}

下一步除了对 html 元素进行重新排序之外，我还想对模型中的数据项进行重新排序。我可以从我拥有的可排序实例中获取有关 dnd 所需的事件。我现在的问题是获取对这些项目的引用。

因为我只想在子元素上存在 repeat.for 行为时才这样做，我认为最好的方法是访问其 Repeat 实例并更新其 items 属性的内容。但是如何检查是否存在这种附加行为以及如何获取 Repeat 实例？

或者是否有更好的方法来访问这些项目（除了再次将它们指定为我的可排序行为的属性）？

干杯，蒂尔曼

【问题讨论】：

我知道这是一篇旧帖子，但想知道您是否还在此处遇到问题？您应该能够在此处使用自定义属性与附加行为。假设你这样做，传递给 bind 的 viewModel 是父级，所以你应该能够保存它，例如this.$parent = viewModel，然后应该定义this.$parent.items。
请标记为已回答，或关闭此问题。谢谢！

标签： aurelia

【解决方案1】：

已经有插件例如https://github.com/buttonwoodcx/bcx-aurelia-reorderable-repeat

你可以通过查看@源代码来查看它是如何实现的（-：

【讨论】：