如何将车把表达式包装在span标签中，并使span标签可点击？

Question

datePick字符串是按钮内的计算属性，您可以单击datePick值来触发事件，但是在按钮内的datePick值外单击不会触发事件。

我尝试将其包裹在一个范围内并给出宽度：100％，但仍然无法点击

<span>
      {{capitalize datePick}}
</span>

我希望它占据按钮内的整个空间并使它在任何地方都可单击。

Answer 1

您是否尝试过添加类似内容：

<span {{action "showDatePicker"}}>
  {{capitalize datePick}}
</span>

并且在您的组件中使用：

import Component from '@ember/component';

export default Component.extend({
  actions: {
    showDatePicker() {
      // Do some stuff to present the date picker.
      console.log('Showing date picker, eh?');
    }
  }
});

action助手默认情况下根据文档假定该事件为click事件：

https://guides.emberjs.com/release/templates/actions/#toc_specifying-the-type-of-event