Translations with arguments in templates as syntax errors

[caredev]

Problem

<template>
    <div>{{ $trans("pagination.showing", {args: { to: "hello" }}) }}</div>
</template>

This syntax generates a compiling error because of the nested curly braces: VueCompilerError: Error parsing JavaScript expression: Unexpected token, expected "," (1:50)

Suggestion

New syntax for $trans, and $__ (breaking change)

$trans('translation', {args1: 'value', args2: 'value'}, {options}) This syntax would make much more sense, be less cluttered and would not rise any compling errors. I understand this is a breaking change, so maybe you can add another function instead.

Create new $newtrans, and $new__ functions

The definition is as simple as: const $newtrans= (key, args = {}, options = {}) => __(key, { args, ...options }); const $new__= (key, args = {}, options = {}) => __(key, { args, ...options });

Usage example

{{
$newtrans("pagination.showing",
                     { from: firstItem, to: lastItem, count: total, },
                     { pluralize: true }
                 )
}}

This raises no compilation errors.

[GENL]

Thank you for the suggestions. Let me take a look for the best approach

[GENL]

Perhaps the best solution is to recommend your wrapper function in the documentation regarding vue js instead of breaking the base code.

[caredev]

Yes, I agree I think it's best to not make breaking changes for something that can be patched so easily.

[GENL]

Let's do that!,

[GENL]

The problem is easily solved when you add space in the curly braces like so:

{{ $trans('auth.throttle', { args: { seconds: 20 } }) }}

{{ $trans('auth.throttle', { args: {seconds: 20} }) }}

This syntaxe is compatible with vuejs.

[caredev]

Most of us use vetur or other auto-formaters that will remove the spaces upon saving. That's not a good solution as it is prone to compilation errors. I still suggest you add a comment on the documentation with the patch functions as a workaround.

[GENL]

Ok thanks. I couldn't guess this as I don't like or use auto formaters

[GENL]

Please if you can propose this in the README. I will review your PR.

Thanks,