Beta 14 view title not showing

ionic-v1
1

Inside my tabs I have <ion-view> with title.

If <ion-view title="string"> then this works fine.

If <ion-view title="{{object.stringProperty}}"> then this doesn’t display at all

1 Like
2

Try view-title

3

Working now, thanks!

4

sometimes now show ‘view-title’.
title value binding after server call

always does work

5

Hi Guys,

I’m having trouble showing ion-view title when value is retrieved from server (service $http).
Eg.

$scope.place is from $http service

<ion-view view-title="{{place.name}}">
    <div class="row">
        <div class="col col-33">
            <span class="abovetext">
                <i class="icon ion-ios7-heart"></i> rating
            </span>
            <span class="belowtext">
                {{place.ratingTaste | placeRating}}
            </span>
        </div>
    </div>
</div>

Thank you

6

I’m having the same issue.

Codepen: http://codepen.io/anon/pen/NPRrmR

It sometimes works the first time the button is clicked, but once you go back and click the button again it never works.

7

i have exactly the same issue when using $http

8

Any news on that issue?

9

I’m having the same problem. Setting view-title doesn’t work when the value comes from a $http service.

10

The best bet is to set the view-title to a scope variable. Then after the data comes from $http, update the scope variable.

view-title="{{data.title}}"

$scope.data.title = 'New Title`
11

Thanks @Calendee, but that’s exactly what I’m doing and it’s not working (check my codepen above).

1 Like
12

Ahhh… This problem. I ran into this as well during the runup to Beta 14. The problem is that the view-title is getthing update during the view transition. So, the view-titile pretty much gets left on the floor.

My “solution” to this is to add a slight delay after getting the result of an HTTP call.

It’s not ideal, but it works : codepen.io/calendee/pen/zxorWm

An alternative, is to use a resolve and get that information before the state change starts. Unfortunately, that can often lead to a bad UX because the user has to wait for the HTTP call to complete before the notice something happening.

A better alternative is to use Ionic’s $ionicView.afterEnter event to not even fetch the name until the transition has completed: http://codepen.io/calendee/pen/LEbGdo?editors=001

13

Using the $ionicView.afterEnter seemed to do the trick, thanks.

14

Another work around would be to pass the title into <ion-nav-title> as per https://github.com/driftyco/ionic/issues/2770

2 Likes
15

You should resolve the http call before running the controller code using ui router’s resolve functionality.

Here is an example using coffeescript

module.exports = ($stateProvider, $urlRouterProvider) ->
    $stateProvider
    .state 'public.post',
        url: "/post/:id"
        views:
            'content':
                template: require "./post"
                controller: "WPHCPostController as post"
                resolve:
                    post : ($wpApiPosts, $stateParams) ->
                        $wpApiPosts.$get $stateParams.id