How to control page routes in the controller?

Question

OnsenUI is great. Fast and easy. However, there is not much documentation for controlling Onsen logic in the controller.

Like for instance, I want to do a $location.path('/newpath') inside a controller. How is done in Onsen? I tried "ons.navigator.pushPage('partials/latestjob.html');" in my controller function but doesn't work. Are we limited to ng-click in Onsen to go to another page?

Thanks.

Answer 1

In Onsen UI 1.04, you can access navigator from inside the controller as follows.

$rootScope.ons.navigator.pushPage('new_page.html');

Another way is

$rootScope.ons.$get('#navigator').pushPage(pagename);

where #navigator is the id of navigator you put on s.t.

<ons-navigator id="navigator" page="page1.html"></ons-navigator> 

This method can choose which navigator you use.

The third way is the one obtaining the navigator scope. For example,

var element = document.querySelector( ".navigator-container");
var scope = angular.element( element ).scope();
scope.pushPage(pagename);

The class name .navigator-container is a built-in class name of onsen ui navigator. This goes well even in onsen ui 1.0.

adding: example of $rootScope

myapp.controller('myCtrl', function($scope, $rootScope) {
  $scope.pushPage = function(pagename) {
    $rootScope.ons.navigator.pushPage(pagename);
  }
});