Question

我努力让这个json成为gulp-html-i18n

"test": [
    {
      "reg1": "Korea",
      "reg2 test": "222",
      "reg3 name": "name2",
    },
    {
      "reg1": "Japan",
      "reg2 test": "223",
      "reg3 name": "name3",
    }
  ],

在HTML中我正在做

${{filename.test.0.reg1}}$

它有效，但是当我尝试以下任何一种替代方案时，都没有效果。有没有办法在不改变json的情况下实现这一目标？

${{filename.test.0.reg2 test}}$
${{filename.test.0.['reg2 test']}}$
${{filename.test.0.[reg2 test]}}$

Answer 1

默认情况下，gulp-html-i18n使用简单的基于正则表达式的引擎，以使用您在JSON中定义的字符串替换 ${{ }}$ 占位符。

用于识别占位符的正则表达式如下：

/\${{ ?([\w-.]+) ?}}\$/g

[Explanation]

如您所见，这只允许占位符中的单个前导/尾随空格。前导/尾随空格不会被解释为属性键的一部分。

如果您希望中的空格属性键，则需要使用不同的正则表达式。以下正则表达式允许您在属性中使用空格。前导/尾随空格仍然被忽略，不会被解释为属性键的一部分：

/\${{ ?([\w-. ]+?) ?}}\$/

[Explanation]

您可以告诉gulp-html-i18n将此正则表达式与langRegExp option：

一起使用

gulp.task('default', function() {
  return gulp.src('index.html')
    .pipe(i18n({
      langDir: './lang',
      langRegExp: /\${{ ?([\w-. ]+?) ?}}\$/g
    }))
    .pipe(gulp.dest('dist'));
});

然后在您的HTML中，您可以使用这样的占位符：

${{filename.test.0.reg2 test}}$
${{ filename.test.0.reg2 test }}$
${{filename.test.0.reg1}}$
${{ filename.test.0.reg1 }}$

哪个应产生以下输出：

222
222
Korea
Korea

Answer 2

您必须使用方括号[]来访问带空格的键。使用时，不需要使用.。所以它可以写成

${{filename.test[0]['reg2 test']}}$

示例

> a=[{test:"hello"},{"test str":"world"}] > a[1]["test str"] "world"

无法在gulp国际化模块中使用空格访问Json密钥

2 个答案: