javascript - 动态确定 Ember 组件的存在？

Question

我正在查看 ember-htmlbars 包并发现了这个用于确定组件是否可用的实用程序？ https://github.com/emberjs/ember.js/blob/master/packages/ember-htmlbars/lib/utils/is-component.js

有什么方法可以在我的应用程序中使用它吗？我正在构建一个仪表板类型的界面，一些仪表板小部件具有可选操作。本质上我想做类似的事情:

<div class="panel panel-default">
  <div class="panel-body">
    {{component model.displayComponent model=model}}
  </div>
  {{#if isComponent(model.actionComponent) }} <!-- this would be a property -->
    <div class="panel-footer">
      {{component model.actionComponent model=model}}
    </div>
  {{/if}}
</div>

我的后备方案是为我的每个没有的小部件放置一个空白操作组件，但如果能够先检查它们是否存在会更清晰。

Answer 1

你可以创建助手 is-component

export default Ember.Helper.extend({
  compute([name]) {
    return this.container.registry.has('component:' + name);
  }
})

并像 {{#if (is-component model.actionComponent) }} 一样使用它