Not able to get ionic content in view

Question

I am unable to get my content and header title in page in Ionic. Let me know what I am doing wrong.

Expecting to have a bar-positive header with Left and Right button and some content, but its coming totally blank no JS error in console too.

index.html

  <body ng-app="starter">
    <ion-nav-view></ion-nav-view>
  </body>

app.js -

  .state('signup', {
    url: '/signup',    
    views: {
      'signup': {
        templateUrl: 'templates/signup.html'
      }
    }
  })

signup.html -

<ion-header-bar align-title="left" class="bar-positive">
  <div class="buttons">
    <button class="button">Left Button</button>
  </div>
  <h1 class="title">Title!</h1>
  <div class="buttons">
    <button class="button">Right Button</button>
  </div>
</ion-header-bar>
<ion-content>
  Some content! Some content! Some content! Some content! Some content! Some content! Some content! Some content! 
</ion-content>

Your state definition says that your signup.html will be loaded when your go this state explicitly by hitting the #/signup url. — Arkantos
@Arkantos I am hitting the URL localhost:8100/#/signup in browser — Tech Solvr

Arkantos Arkantos · Accepted Answer · 2016-01-12T18:43:59

Your state config for signup looks for a named view called signup (under views object) but your <ion-nav-view> is not a named one. You can fix this by adding name attribute to <ion-nav-view> like below.

<ion-nav-view name="signup"></ion-nav-view>

(or) you can remove the named views definition from your state if you're certain that there's always one view that needs to be updated.

.state('signup', {
    url: '/signup',    
    templateUrl: 'templates/signup.html'
  });

Not able to get ionic content in view

1 Answers