View will not load


#1

Hello everyone. I’m working off of the the ionic-angular-cordova-seed project(https://github.com/driftyco/ionic-angular-cordova-seed), and I’m trying to do what I thought would be simple: add an additional view in the app. Unfortunately, my new view will not display and I can not figure out why.

Here is the code that sets up the various states, ‘tab.pic’ is the one I’ve been trying unsuccessfully to add:

$stateProvider

// setup an abstract state for the tabs directive
.state('tab', {
  url: "/tab",
  abstract: true,
  templateUrl: "templates/tabs.html"
})

// the pet tab has its own child nav-view and history
.state('tab.pet-index', {
  url: '/pets',
  views: {
    'pets-tab': {
      templateUrl: 'templates/pet-index.html',
      controller: 'PetIndexCtrl'
    }
  }
})

.state('tab.pet-detail', {
  url: '/pet/:petId',
  views: {
    'pets-tab': {
      templateUrl: 'templates/pet-detail.html',
      controller: 'PetDetailCtrl'
    }
  }
})



.state('tab.adopt', {
  url: '/adopt',
  views: {
    'adopt-tab': {
      templateUrl: 'templates/adopt.html',
      controller: 'CameraCtrl'
    }
  }
})

.state('tab.pic', {
  url: '/adopt/pic',
  views: {
    'pic-tab': {
      templateUrl: 'templates/pic.html'
    }
  }
})

.state('tab.about', {
  url: '/about',
  views: {
    'about-tab': {
      templateUrl: 'templates/about.html'
    }
  }
});

I was first trying to load the ‘pic’ tab by using $state.go(‘tab.pic’), and I thought maybe I was using $state.go incorrectly, but then I tried it by replace "tab.pic’ with ‘tab.pet-index’, ‘tab.adopt’, and ‘tab.about’, and in those cases, it worked and the appropriate view loaded.

I also tried making a button that explicitly specified ‘href="#/tab/adopt/pic"’, and that was also a failure, so I’m lost and hoping someone knows what I’m doing wrong.

Thanks for reading.