我怎样才能在Ionic2

编程方式更改离子称号我Ionic2项目我已标签视图包含三个选项卡：我怎样才能在Ionic2

tabs.ts

<ion-navbar *navbar> 
    <ion-title>My tab parent title</ion-title> 
</ion-navbar> 

<ion-tabs> 
    <ion-tab [root]="tab1Root" tabIcon="people"></ion-tab> 
    <ion-tab [root]="tab2Root" tabIcon="person"></ion-tab> 
    <ion-tab [root]="tab3Root" tabIcon="globe"></ion-tab> 
</ion-tabs>

有谁知道我可以编程方式更改ion-title这个页面来自其中一个子选项卡？

来源

2016-05-26 Bas van Dijk

也许你可以使用一个提供者来存储一个“全局变量”，这个变量可以从提供者注入的任何页面进行修改。看到这篇文章：https://ionicallyspeaking.com/2016/03/10/global-variables-in-ionic-2/ – wdickerson

因为两个人已经给出了答复，你已经表明，这不是你在找什么，我可能会建议你提问更好，因为它看起来不太清楚。 –

http://ionicframework.com/docs/v2/components/#tabs

你试图在特定页面

@Page({ 
    template: ` 
    <ion-navbar *navbar> 
     <ion-title>Heart</ion-title> 
    </ion-navbar> 
    <ion-content>Tab 1</ion-content>` 
}) 
class Tab1 {}

来源

2016-05-27 02:26:58

是的，但不是我想要的。我需要在所有选项卡的“父级”页面中定义标题。不在tabpage本身。 –

看到我对如何使用供应商在不同页面之间共享数据答复here只创建离子导航栏：在您的标签模板使用您存储在提供商<ion-title>{{globalService.titleName}}</ion-title>中的变量，并在您的标签页中修改数值globalService.titleName

使用供应商使全球数据为我工作在离子2测试版6，我相信它是在角2

建议的做法生成的命令行提供者：ionic g provider GlobalService注意如何生成的服务用@Injectable

注入您的服务@App类;您可以通过提供一个存储在声明它做到这一点：

@App({ 
     templateUrl: 'build/app.html', 
       providers: [GlobalService] , 
       config: {} // http://ionicframework.com/docs/v2/api/config/Config/ 
      })

这将创建一个服务提供商的一个单独的实例，它是每一个页面上入店。无论你需要使用它，做提供商数组中不申报，但在页面的构造函数：

@Page({ 
     templateUrl: 'build/pages/new-page/new-page.html', 
     }) 
     export class NewPage{ 

     constructor(public globalService: GlobalService) { 
    } 

    someFunction(){ 
    this.globalService.someGlobalFunction(); 
    }

来源

2016-05-27 07:04:02

感谢您的回答，但这不是我正在寻找的。我需要在所有选项卡的“父级”页面中定义标题。不在tabpage本身。原因是父页面有一些按钮，例如搜索以及其他一些需要在所有选项卡中可用的操作。因此，选项卡没有定义的导航栏。 –

是吗？这与navbars或没有关系;任何注入服务的页面都可以访问'globalService.titleName'。您可以从您的选项卡更改它，并在您的父模板中使用它。 –

这不是我想要的。我需要在所有选项卡的“父级”页面中定义标题。不在tabpage本身或服务中。 –

导入应用程序并将其添加为一个构造

import { App } from 'ionic-angular'; 

constructor(private app: App) { }

然后添加事件处理器在进入页面

ionViewDidEnter() { 
    this.app.setTitle('people'); 
    }

来源

2016-07-15 15:17:51 LeRoy

我就是这么做的：

<ion-header> 
    <ion-navbar> 
    <ion-title>{{title}}</ion-title> 
    </ion-navbar> 
</ion-header> 
<ion-tabs> 
    <ion-tab [root]="tabLogin" tabTitle="Login" tabIcon="log-in" (ionSelect)="this.title ='Login'"></ion-tab> 
    <ion-tab [root]="tabSignup" tabTitle="Sign up" tabIcon="add-circle" (ionSelect)="this.title ='Sign up'"></ion-tab> 
</ion-tabs>

来源

2016-12-28 13:18:51 Paul

非常感谢。让我永远找到像这样的好答案。 – AliF50

我怎样才能在Ionic2

回答

相关问题