How to use navigator buttons to execute actions other than navigate between pages

StackOverflow https://stackoverflow.com/questions/23208272

Question

Suppose I have the following snippet for an application using Onsenui:

<ons-navigator-toolbar title=""
    left-button-icon="fa fa-lg fa-edit"
    on-left-button-click="window.alert('asdf');"
    right-button-icon="fa fa-lg fa-plus"
    on-right-button-click="myAngularFunction();">
</ons-navigator-toolbar>

The functions for the events on-left-button-click and on-right-button-click are not getting called. Just functions to navigate between pages work (for instance, ons.screen.presentPage('other_page.html')).

Is this a known Onsenui limitation, a design principle or just a bug? Is there any way to overcome it?

Was it helpful?

Solution

It's AngularJS limitation.

You cannot call function outside AngularJS.

you can wrap window.alert function inside your controller function.

Also, you need to set your controller above ons-navigator.

If you use, ons-navigator-toolbar, its scope is not the page but the navigator scope. This is current limitation of Onsen UI, it is being resolved in the next version.

Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top