Setting view title from remote content


#1

I’m trying to come up with a way to store some templates remotely, and for the main part it’s starting to work. One major issue I’m running into is figuring out how to set the title of the view. I’ve tried adding a custom directive <title-override> and setting the title on the scope, I’ve tried using $ionicNavBarDelegate, nothing seems to work. In a lot of cases, the first remote view will load and title is set correctly, but then child views might not get set when loaded. (I didn’t include my directive attempts since none of them are close to working).

app.js

...
.state('app.content', {
        url: '/content/{path:.*}',
        views: {
          'menuContent': {
            templateUrl: 'templates/content.html',
            controller: 'ContentCtrl'
          }
        }
})
...

controllers.js

...
.controller('ContentCtrl', function($rootScope, $scope, $state, $ionicNavBarDelegate) {
  $scope.remoteContentUrl = $rootScope.url('/remote/content/' + $state.params.path + '.html');
})
...

templates/content.html

    <ion-view view-title="{{ title }}">
      <ion-content>
        <ng-include src="remoteContentUrl" onload="loaded()">
      </ion-content>
    </ion-view>

And basically as an example I was trying to make a “remote template” and put something like this in it:
remote/templates/content/fruits.html

<title-override>Fruits</title-override>
<a href="#/app/content/fruits/apple">Apple</a>
<a href="#/app/content/fruits/orange">Orange</a>

remote/templates/content/fruits/apple.html

<title-override>Apple</title-override>
<a href="#/app/content/fruits">All Fruits</a>

Any ideas of a good way to handle this hierarchical remote content with titles? Maybe I’m structuring this in a really bad way?


#2

Figured it out, I needed to use <ion-nav-title>{{content.title}}</ion-nav-title> instead of view-title.