我想呈现一个将在变量中定义的组件。
我有一个包含类似内容的变量:
page.js
Ember.Controller.extend({
c: {
'pageTitle': 'This is the title with a component {{my-component}}'
}
});
page.hbs
<div>
{{c.pageTitle}}
</div>
c
对象是从内容服务器通过API调用填充的。我想提供从内容中定义的内容注入组件的能力。
基本上,我需要渲染两次,第一次用字符串替换{{pageTitle}}
,第二次用组件替换{{my-component}}
。
做这种事的最佳解决方案是什么?
感谢
您可以使用新的{{component}}助手(在Ember的最新版本中)来渲染组件
{{component 'my-component'}}
{{component c.myPageTitleComponent}}
为了呈现文本,您可以做两件事:
在您的模板中
您可以直接在模板中实现文本
{{c.myPageTitleText}} {{component c.myPageTitleComponent}}
使用父零部件
您可以实现一个父组件:
{{my-parent-component text=c.myPageTitleText componentName=c.myPageTitleComponent}}
然后在"我的父组件"中,它看起来像这样:
{{text}} {{component componentName}}
除非您在我的父组件中需要一些自定义逻辑,否则这并没有什么意义。