作者热门文章
- html - 出于某种原因,IE8 对我的 Sass 文件中继承的 html5 CSS 不友好?
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景?
我正在从路由模板属性创建一个 emberjs 组件,我正在传递值以在模板中显示。但是我无法通过对象的括号表示法在组件模板中访问它。
//route.hbs
{{b-select
options=model.names
valueProp='name'
}}
模型
import Ember from 'ember';
export default Ember.Route.extend({
model() {
return Ember.RSVP.hash({
names: [{name: 'abc'}, {name: 'xyz'}]
});
}
});
组件b-选择hbs文件
<select class="form-control" multiple={{multiple}}>
{{#each options as |option|}}
<option value="{{option}}">{{option[valueProp]}}</option>
{{/each}}
</select>
如果我使用 option.name
而不是 option[valueProp]
,它会完美运行。我如何动态传递属性以进行选择?为什么括号符号不起作用
组件JS文件
import Ember from 'ember';
import fallbackIfUndefined from '../utils/computed-fallback-if-undefined';
export default Ember.Component.extend({
multiple: fallbackIfUndefined(false),
options: fallbackIfUndefined(null),
valueProp: fallbackIfUndefined(0),
actions: {
},
didInsertElement() {
//initialize jquery functions
this.$('select').selectpicker({size: 6});
},
willDestroyElement() {
//remove all events
}
});
我得到的错误是
错误:第 3 行出现解析错误:...alue="{{option}}">{{option[valueProp]}}<----------------------^期待“ID”、“STRING”、“NUMBER”、“BOOLEAN”、“UNDEFINED”、“NULL”、“DATA”,得到“INVALID”
最佳答案
您可以使用 {{get}}助手:
<option value="{{option}}">{{get option valueProp}}</option>
关于javascript - 如何在 Handlebars 模板中使用对象的括号表示法?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/36171210/
我是一名优秀的程序员,十分优秀!