在Aurelia中用模板本身替换自定义元素（而不是将其包含在自定义元素中）？

Question

假设我有一个自定义元素<foo-bar></foo-bar>而不是将标记呈现到标记中，我想替换它们，以便“foo-bar”元素不再是DOM的一部分。 我相信Angular通过transclude属性来做到这一点。

在Aurelia有办法做到这一点吗？

Answer 1

您需要在组件上使用无containerless装饰器。

从文档的自定义元素部分 ：

@containerless() - 使元素的视图在没有自定义元素容器包装的情况下呈现。 这不能与@sync或@useShadowDOM一起使用。 它也不能用于代理行为。

所以你的组件应该是这样的：

import {customElement, bindable, containerless} from 'aurelia-framework';

@customElement('say-hello')
@containerless()
export class SayHello {
  @bindable to;

  speak(){
    alert(`Hello ${this.to}!`);
  }
}