Javascript 如何在Vue模板中转义矩.js格式化程序上的HTML字符串？

假设我将当前日期筛选为2019年2月22日。我希望

nd

标志位于

标记内。问题是，我同时使用Vue和Moment.js

在PHP中，我只需执行以下操作：

{！！Carbon\Carbon:：today（）->格式（'F dS Y'）！！}

但我如何在Javascript和Vue中做到这一点？或者也许有更干净的方法可以做到这一点？请看一下我的剧本

<template>
    <div class="container">
        <!-- Textbox -->
        <div class="textbox text-white">
            <p>Realtime Flight Schedule</p>
            <div class="live-datetime">
                <h1>{{ currentDate | filterCurrentDate  }}</h1>
                <digi-clock></digi-clock>
            </div>
        </div>
        <!-- Flight table -->
        <flight-table></flight-table>
    </div>
</template>
<script>
import moment from 'moment'
export default {
    filters: {
        filterCurrentDate(date) {
            return moment(date).format("MMMMM Do Y")
        }
    },
    data() {
        return {
            currentDate: new Date(),
        }
    },
}
</script>

实时航班时刻表

{{currentDate | filterCurrentDate}
从“时刻”导入时刻
导出默认值{
过滤器：{
过滤器当前日期（日期）{
返回时间（日期）。格式（“MMMMM Do Y”）
}
},
数据（）{
返回{
currentDate:新日期（），
}
},
}

我相信你必须使用它。因此，您需要

filterCurrentDate

从文本开始生成HTML，然后使用

v-HTML

按原样呈现

<h1 v-html="filterCurrentDateHTML(currentDate)"></h1>

---

它的可能重复给了我

意外的标记：${ord.replace（/\d/+，''）}

在

+

符号之后，sir@DonnyPratama-嘿，正如它所说，

+

是不正确的。：-）那条线上还有另一个错误。我已经更新了答案，希望这是这里仅有的两个错误。谢谢你，先生，它是有效的，我只想告诉你，在

${m.format（'Y'）}

之后，还有一个额外的

）

也会产生错误，所以我把它移到了

方法

属性，并像这样使用它。是的，它可以在没有

span

@Styx的情况下工作-是的，我考虑过这一点，然后决定允许具有不同长度序号的区域设置。（但不允许数字与非数字不起作用的地区，因此…可能不一致。：-）

const m = moment(date);
const ord = m.format("Do");
return `${m.format("MMMMM")} ${ord.replace(/\D/g, '')}<sup class="small">${ord.replace(/\d/g, '')}</sup> ${m.format('Y')}`