如何防止树枝自动转义日语字符？

Question

我正在试图显示产品的到货日期。我使用moment.js将YYYY/MM/DD日期字符串格式化为日语本地字符串。我的javascript代码包含在一个twig文件中：

<script>
        moment.locale('ja');
        let updateArrivalDate = function() {
            $('.arrival-date').each(function() {
                let $this = $(this);
                $selectDate = $this.next().next().find('select').eq(0);
                $selectTime = $this.next().next().find('select').eq(1);
                var text = $selectDate.val();
                var date = moment(text, 'YYYY/MM/DD');
                if (date.isValid()) {
                    $this.text(date.format('{{ 'YYYY年M月D日 (dd)'|raw }}'))
                }
            });
        };
        $(document).ready(function() {
          updateArrivalDate();
            $('select').on('change', function() {
                updateArrivalDate();
            });
        });
    </script>

如您所见，我使用raw过滤器来防止树枝转义日语字符。尽管如此，小枝还是逃脱了一些特殊的字符，文字也被混淆了：

​

​

当然，如果我将上面的片段移到外部文件中，就会解决这个问题。但说真的，难道没有办法阻止小枝逃离日本文字吗？为什么raw filter 不能运行？

Answer 1

从cdn (或从npm/yarm安装包)导入ja区域设置，如https://momentjs.com/docs/#/i18n/中所示

如果使用cdn承载的js，则使用以下代码：

<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.24.0/moment.min.js" integrity="sha256-4iQZ6BVL4qNKlQ27TExEhBN1HFPvAvAMbFavKKosSWQ=" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.24.0/locale/ja.js" integrity="sha256-CFWtR1hGN/5Vc+kcJkqeMFND0g6gFFZdnSqUtdL7WOQ=" crossorigin="anonymous"></script>

然后，而不是：

 $this.text(date.format('{{ 'YYYY年M月D日 (dd)'|raw }}'))

使用：

 var date = moment(text, 'YYYY/MM/DD');
 $this.html(date.locale('ja').format('LL (dd)'))

并移除：

        moment.locale('ja');

线路

所以你的剧本是：

<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.24.0/moment.min.js" integrity="sha256-4iQZ6BVL4qNKlQ27TExEhBN1HFPvAvAMbFavKKosSWQ=" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.24.0/locale/ja.js" integrity="sha256-CFWtR1hGN/5Vc+kcJkqeMFND0g6gFFZdnSqUtdL7WOQ=" crossorigin="anonymous"></script>
<script>
        let updateArrivalDate = function() {
            $('.arrival-date').each(function() {
                let $this = $(this);
                $selectDate = $this.next().next().find('select').eq(0);
                $selectTime = $this.next().next().find('select').eq(1);
                let text = $selectDate.val();
                let date = moment(text, 'YYYY/MM/DD');
                if (date.isValid()) {
                    $this.text(date.locale('ja').format('LL (dd)'))
                }
            });
        };
        $(document).ready(function() {
          updateArrivalDate();
            $('select').on('change', function() {
                updateArrivalDate();
            });
        });
    </script>

请参阅下面的示例，该示例仅包含有关语言的形成：

​

$(document).ready(function(){
 $("#date").html(moment().locale('ja').format('LL (dd)'))
});

<script src="https://momentjs.com/downloads/moment.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.24.0/locale/ja.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<div id="date"></div>

​

因此，您可以让时间来格式化日期，并使用js/twig避免任何复杂性。只要保持简单，让js做好它的工作，而不是把它们混合在一起。

Answer 2

我想你可以这样修改代码：

$this.text(date.format('{{ "YYYY年M月D日 (dd)"|json_encode()|raw }}'))