在AureliaJS中，如何从JS添加/删除视图而不是标记？

Question

我有几个实现自定义元素的视图/组件，所以我在我的标记中使用它们如下：

  <require from="./panels/property_inspector/PropertyInspector"></require>
  <property-inspector--panel></property-inspector--panel>

到目前为止一切顺利。但现在我需要以编程方式添加/删除这些类型的视图/组件。我正在阅读奥里利亚中心，但我没有成功......任何提示都表示赞赏。

Answer 1

根据您要完成的任务，我同意@peinarydevelopment compose可能对您有用。 See compose documentation

您可以使用<compose>元素并将view-model属性绑定到视图模型上的属性。此属性应指定视图模型的路径或已导入的视图模型的实际实例。

示例：

app.html

<template>
  <h2>dynamic view model by path</h2>

  <button click.trigger="loadNewViewModel()">Load different vm</button>

  <compose view-model="${currentViewModel}"></compose>

</template>

app.js

export class App {

  currentViewModel = "test.js";

  loadNewViewModel(){
    this.currentViewModel = "new.js"
  }
}

看到这个要点： https://gist.run/?id=a2f17028d45ea202cd19be5491272dde