Appgyver Steroids js Navbar update clashing with boilerplate angular method

Question

I am writing a single page appgyver js application. When the application loads up (ondeviceready) it checks to see if a user is logged in via js and if so it fires a js method (Method 1). The js method does a few things, the last of which is to update the navbar title.

I am experiencing a problem whereby the boilerplate code in application.js

angular.module('SteroidsApplication', [
  'supersonic'
])
.controller('IndexController', function($scope, supersonic) {

  $scope.navbarTitle = "AppName";

});

seems to be running after Method 1 runs, despite being called in the head of the html file. Method 1 is within the body of index.html.

Method 1 does run, and the success handler of the supersonic.ui.navigationBar.update method is called. If I run method 1 after initial startup, the navbar update works as expected.

Does anyone know why the boilerplate method is running after Method 1, and how I can fix this?

Edit 1

If I comment out

  $scope.navbarTitle = "AppName";

The same problem occurs.

Edit 2

This is definitely a timing issue. If I delay Method 1 by 3 seconds (using setTimeout) the issue disappears. This doesn't fix the problem, but it does corroborate my initial suspicions.