如何使用流星和aldeed获得翻译的列标题:表格?
问题描述:
我遇到了与issue #53 of aldeed:tabular
相同的问题。按照documentation中的建议定义表格时,由于尚未设置I18N变量,因此调用翻译函数(TAPi18n.__
或其他)太早。如何使用流星和aldeed获得翻译的列标题:表格?
将翻译的栏目标题翻译为DataTables
的好的反应式方式,在结束问题时直接作为suggested by aldeed himself或通过aldeed:tabular
?
答
随着
随着.tabular.options
没有与模板的.tabular.options
反应 变量的一种方式,但它是古怪的。下面是一个使用 tap-i18n到 列标题翻译library example的变化:
function __(key) {
if (Meteor.isServer) {
return key;
} else {
return TAPi18n.__(key);
}
}
Books = new Meteor.Collection("Books");
TabularTables = {};
TabularTables.Books = new Tabular.Table({
name: "Books",
collection: Books,
columns: [] // Initially empty, reactively updated below
});
var getTranslatedColumns = function() {
return [
{data: "title", title: __("Title")},
{data: "author", title: __("Author")},
{data: "copies", title: __("Copies Available")},
{
data: "lastCheckedOut",
title: __("Last Checkout"),
render: function (val, type, doc) {
if (val instanceof Date) {
return moment(val).calendar();
} else {
return "Never";
}
}
},
{data: "summary", title: __("Summary")},
{
tmpl: Meteor.isClient && Template.bookCheckOutCell
}
];
}
if (Meteor.isClient) {
Template.tabular.onRendered(function() {
var self = this;
self.autorun(function() {
var options = _.clone(self.tabular.options.get());
options.columns = getTranslatedColumns();
self.tabular.options.set(_.clone(options));
});
});
}
随着
我创建了一个pull request对branch devel
of meteor-tabular
,使简单的,无分支版本这样的方法如下:
<template name="MyTemplateWithATable">
{{> tabular table=makeTable class="table table-editable table-striped table-bordered table-condensed"}}
</template>
var MyColumns = ["title", "author"];
// Assume translations are set up for "MyTable.column.title", "MyTable.column.author"
// in other source files; see TAPi18n documentation for how to do that
function makeTable() {
return new Tabular.Table({
name: "MyTable",
collection: MyCollection,
columns: _.map(MyColumns,
function(colSymbol) {
return {
data: colSymbol,
title: TAPi18n.__("MyTable.column." + colSymbol)
};
})
});
}
if (Meteor.isServer) {
// Called only once
makeTable();
} else if (Meteor.isClient) {
// Reactively called multiple times e.g. when switching languages
Template.MyTemplateWithATable.helpers({makeTable: makeTable});
}
答
最近aldeed的版本:表格允许指定函数设置列标题。
import {TAPi18n} from 'meteor/tap:i18n';
TabularTables = {};
TabularTables.Departments= new Tabular.Table({
name: 'Departments',
collection: Departments,
responsive: true,
autoWidth: true,
stateSave: false,
columns: [
{data: "name", titleFn: function() {
return TAPi18n.__("name");
}},
{data: "description", titleFn: function() {
return TAPi18n.__("description");
}}
]
});
语言更改是反应式的。如果你有翻译,你可以切换和列将被翻译。
TAPi18n.setLanguage("en");
TAPi18n.setLanguage("de");
字的警告: 目前这当您在您的表中的数据无形列不起作用。偏移量是错误的,你会得到错误的列标题。