如何传递变量值？

Question

对于那些可能更熟悉在AngularJs / Ionic 2中编写变量的人，请问您能否为我提供以下解决方案：

在我的app.components文件中，有以下内容用于设置补充菜单项。 我已经将变量translationPageA添加到每一行：

appPages: PageInterface[] = [
  { title: translatedPageA, component: TabsPage, tabComponent: PageAPage },
  { title: translatedPageB, component: TabsPage, tabComponent: PageBPage },
  { title: translatedPageC, component: TabsPage, tabComponent: PageCPage },
  { title: translatedPageD, component: TabsPage, tabComponent: PageDPage }

];  

我需要将一些变量值传递给它：

{{'translatedPageA' | translate }} 

正如您所看到的，因为它包含在一个表达式中，所以我不能插入另一个表达式。 因此，解决方案是先通过变量。 如何创建此变量，并将其插入到哪里？

我努力了：

var translatedPageA: {{'HOME' | translate }};

Answer 1

您可以使用$translate.instant() 。 这个AngularJS翻译帮助器将允许您直接在控制器内部翻译标记。

myApp.controller('MyCtrl', function ($scope, $translate) {

    //translate inside controller with instant
    var PageInterface = [
        { title: $translate.instant('HOME'), component: TabsPage, tabComponent: PageAPage },
        { title: $translate.instant('SIDEB'), component: TabsPage, tabComponent: PageBPage },
        { title: $translate.instant('SIDEC'), component: TabsPage, tabComponent: PageCPage },
        { title: $translate.instant('SIDED'), component: TabsPage, tabComponent: PageDPage }
    ];  
});

---

另一种方法是将标题值直接解析到视图中。 可以这样完成：

Demo fiddle

视图

<div ng-repeat="interfaceItem in pageInterface">
  {{ interfaceItem.title | translate}}
</div>

AngularJS控制器

myApp.controller('MyCtrl', function ($scope, $translate) {

    //translate inside controller with instant
    $scope.pageInterface = [
        { title: 'HOME' , component: TabsPage, tabComponent: PageAPage },
        { title: 'SIDEB', component: TabsPage, tabComponent: PageBPage },
        { title: 'SIDEC', component: TabsPage, tabComponent: PageCPage },
        { title: 'SIDED', component: TabsPage, tabComponent: PageDPage }
    ];  
});