Ionic 2 中的 tabTitle 上的 ng2-translate 没有出现

Question

我正在尝试将 ng2-translate 用于 ion-tab，但标题没有出现......我不明白，因为我已经在另一个文件上使用了翻译并且它有效！

这是我的 HTML 代码在我的 tabs.html:

<ion-tab [root]="tab2Root" tabTitle="{{'TEST' | translate}}" tabBadge="1" tabBadgeStyle="notif"></ion-tab>

我的代码在 tabs.ts

export class TabsPage {
   tab2Root : Page2;
}
constructor(translate: TranslateService) {
 translate.setDefaultLang('fr');
 translate.use('fr');
}
}

我的 assets/translation 文件夹中有一个 fr.json 文件。它有效，因为我已经在使用它了。

我不知道我必须做什么...

Answer 1

终于找到解决办法了。我的翻译出现在页面上，但默认样式将我的跨度显示设置为 "none"。我重写了这个样式来解决我的问题。

.tab-button-text {
     display: block !important
}

我在我的 variable.scss 文件中更改了它。我希望我的回答可以帮助别人。

Answer 2

我遇到了同样的问题，另一种解决方法是在翻译前留下一个space。在你的情况下，像这样：

<ion-tab [root]="tab2Root" tabTitle=" {{'TEST' | translate}}" tabBadge="1" tabBadgeStyle="notif"></ion-tab>

:)

ng2-translate on tabTitle in Ionic 2 don't appear