在字符串的一部分使用过滤器

Question

我有一个过滤器，可以根据数字的统计类型（百分比、整数、货币等）格式化数字。我想在一个值上使用此过滤器作为字符串的一部分。见下文：

<js-widget
                v-on:click="this.selectedReportId = key"
                :selected="this.selectedReportId == key"
                :icon="report.icon"
                :stat="report.current | stat report.statType"
                :title="report.title"
                :tooltip="report.tooltip"
                :percent="report.percent"
                :description="'Previous value: '+(report.past | stat report.statType)">
</js-widget>

正如您在 :stat 参数中看到的那样，如果表达式中只有它，我可以使用过滤器。但是当它尝试计算 :description 参数时，我得到 Error when evaluating expression。是否可以这样使用过滤器？

Answer 1

过滤器是在您正在计算的表达式之外可用的东西——所以它在语法上不起作用

我会改用 computed 属性。有关详细信息，请参阅 http://vuejs.org/guide/computed.html。

Answer 2

好久没提这个问题了，不过有人搜索一下，我正好知道解决办法。首先，有一种方法可以从 vue 组件内部调用过滤器。实际上所有过滤器都存储在

this.$options.filters

collection。所以如果你想从组件内部调用过滤器，你应该这样做

...
this.$options.filters.stat(report.past, report.statType)
...

如果你想从标记中做同样的事情，你也应该调用过滤器而不是像过滤器（| 语法），而是像组件方法

<js-widget
                v-on:click="this.selectedReportId = key"
                :selected="this.selectedReportId == key"
                :icon="report.icon"
                :stat="report.current | stat report.statType"
                :title="report.title"
                :tooltip="report.tooltip"
                :percent="report.percent"
                :description="'Previous value: '+ $options.filters.stat(report.past, report.statType)">
</js-widget>

或者，更好的是，使用模板字符串

:description = "`Previous value: ${$options.filters.stat(report.past, report.statType)}`"

在字符串的一部分使用过滤器

Using a filter in part of a string

vue.js