Change ion-title in ts file

How can I change the ion-title in my home.html file through a function in my home.ts file?

<ion-header>
<ion-navbar color="dark">
    <button ion-button menuToggle>
        <ion-icon name="menu"></ion-icon>
    </button>

  <ion-title></ion-title> <---- I want to change this value through a function in my ts file
</ion-navbar>

means you want to change the text of the title???

yep exactly. can it be done through a function in my ts file?

you can do it with data binding…

how does one do data binding? do you have any links I can use? :sweat_smile:

Are you are new to the Ionic and Angular?,
Its pretty simple actually

on html
<ion-title>{{myTitle}}<ion-title>

and in your ts component

myTitle: string = 'Default Title';

myFunction() {
   this.myTitle = 'Dynamic Title';
}

Thats all

2 Likes

yep I’m still learning from the get go and whatever problems I encounter :sweat_smile::sweat_smile:

I’ll try this out then. I’ll let you know if it works

I recommend you to first get to know about the Angular before learning Ionic.

I’ll keep that in mind then :+1:

:+1::+1: Welcome to the Ionic & Angular

@vnyksj I couldnt bind the title … It is not at all changing dynamically can you please help me

Can you post your code?