Ember.js对我来说是全新的。(当前版本5.4)
我想建立一个小的WebUI。登录和菜单导航工作得很好。但我有问题的循环和可视化信息从单一循环的组件。
我有一个“主轴”组件。我在这个模板中每个循环。现在我想在每个循环中安装一个组件,并从该组件的模板中的对象输入各种信息。标题,值等。
main-axis.hbs
<div class="row">
{{#each this.exampleArray as |axis|}}
<div class="col-12 col-lg-6">
<LinearAxis />
</div>
{{/each}}
</div>
字符串
main-axis.js
import Component from "@glimmer/component";
export default class MainAxis extends Component {
exampleArray = [
{title: 'foo', id:7},
{title: 'bar', id:42}
];
}
型
示例模板“linear-axis.hbs”
<div class="card">
<div class="card-header">
Axis {{this.title}}
</div>
<div class="card-body">
<p class="card-text">Number: {{this.id}}</p>
<button type="button" class="btn btn-primary btn-sm">Click</button>
</div>
</div>
型
app/components中的空js类“linear-axis.js
import Component from '@glimmer/component';
export default class LinearAxis extends Component {
// how i get informations from the loop and provide them into the individual template instance
}
型
我花了很多时间在Ember.js的文档上,并没有真正深入了解。
1条答案
按热度按时间t0ybt7op1#
您可以执行
<LinearAxis @axis={{axis}}/>
,并在组件模板中执行{{@axis.title}}
在
linear-axis.js
中,它将在this.args.axis
上