Change of header title in appery.io ionic project

This forum contains topics that were moved from Get Satisfaction
Javier Ferreiro7559174
Posts: 0
Joined: Thu May 28, 2015 10:38 pm

Change of header title in appery.io ionic project

Post by Javier Ferreiro7559174 »

Hi
On an ionic project, I've defined a header in index.html, but I cannot change its value per screen. Is this feature supported?
I've tried the following:
Image

Then declare the scope variable in index

Image

Then change the scope variable value per screen, in this example startScreen.html, function init()
Image

BR
Javier

Serhii Kulibaba
Posts: 147
Joined: Tue Aug 27, 2013 1:47 pm

Change of header title in appery.io ionic project

Post by Serhii Kulibaba »

Hello Javier,

It looks like correct, please send us screenshot of the result from app web preview. Could you check are there any errors in console?
Please try to clear your browser with next steps :
http://devcenter.appery.io/documentat...

Close your browser and open again.
Kindly let us know result.

Javier Ferreiro7559174
Posts: 0
Joined: Thu May 28, 2015 10:38 pm

Change of header title in appery.io ionic project

Post by Javier Ferreiro7559174 »

Sergiy

No console errors
Browser cleared
Browser restarted
I've also created an app from scratch that only includes the header manipulation documented above; and a text component on the body of Screen1

The text component in the body is shown, but
Although the header is shown, no text is displayed inside it

Image

BR
Javier

Yurii Orishchuk
Posts: 0
Joined: Fri Feb 14, 2014 8:20 am

Change of header title in appery.io ionic project

Post by Yurii Orishchuk »

Hi Javier,

Here is a solution to change header from screen:

1 Open "Model" interface.

2 Create model with name "mainScreen" and child string "header"
Details: http://prntscr.com/7kmflg/direct

3 Navigate to "index" screen - scope tab and add "mainScreen" variable with type "mainScreen"
Details: http://prntscr.com/7kmg7k/direct

4 Add to Init function following JS code:
Details: http://prntscr.com/7kmjgm/direct

pre

$scope.mainScreen.header = "Header text from index";

/pre

5 Open needed/goal page.

6 Add button to the page.

7 Activate button component. Add "ng-click" attribute with value:
Details: http://prntscr.com/7kmkc3/direct

pre

mainScreen.header = "page header"

/pre

That's all. Now you will change header text to "page header" on this button click.

Regards.

Javier Ferreiro7559174
Posts: 0
Joined: Thu May 28, 2015 10:38 pm

Change of header title in appery.io ionic project

Post by Javier Ferreiro7559174 »

Thankx for the tip, Yurii!
Now it's working as expected
BR
Javier

Post Reply