Default child view won't load (solved)

ionic-v1
1

UPDATE: After taking an hour break, I found the issue: the ui-sref on the Category screen that I was using to get to the Deck was pointing at the ‘deck’ state, when it should have been pointing at the default child state I wanted to load—‘deck.detail’. In other words, when trying to load a default child view, link to that child view state and not to the parent.

category.html

<ion-view title="{{current.label}}">
  <ion-nav-bar>
    <ion-nav-back-button class="button-clear">
      <i class="icon ion-ios-arrow-back"></i>
    </ion-nav-back-button>
  </ion-nav-bar>
  <ion-content scrolling="false">
    <ion-list>
      <ion-item ng-repeat="deck in decks" ui-sref="deck.detail({ product_id: deck.product_id })">
        {{deck.product_id}}
      </ion-item>
    </ion-list>
  </ion-content>
</ion-view>

ORIGINAL POST:

I’m prototyping my first Ionic app, and I’ve hit a wall trying to implement child views. Any help would be appreciated, because it’s driving me nuts!

The basic flow of the app is that there are Categories, and within the Categories there are Decks, and for each Deck there are Cards and Settings (accessible from a ‘detail’ Deck view). My plan was to have Cards and Settings be child views of the Deck, so that they could share the same controller. (The controller would have a config object that would be changed via the Settings view, and used to build the Card view.) However, I can’t get a default child view—the detail view—to load at all.

Here’s the relevant code I have now (which is based on this Stack Overflow answer: http://stackoverflow.com/a/21977045/2635396)

app.js

.state('category', {
      url: '/category',
      params: {
        id: 0
      },
      templateUrl: 'html/category.html',
      controller: 'CategoryController'
  })

  .state('deck', {
      url: '/deck',
      params: {
        product_id: 0
      },
      templateUrl: 'html/deck.html',
      controller: 'DeckController'
  })

  .state('deck.detail', {
      url: '',
      templateUrl: 'html/deck.detail.html'
  })

deck.html

<ion-view title="Deck Main">
  <ion-nav-bar>
    <ion-nav-back-button class="button-clear">
      <i class="icon ion-ios-arrow-back"></i>
    </ion-nav-back-button>
  </ion-nav-bar>
  <ion-nav-view></ion-nav-view>
</ion-view>

deck.detail.html

<ion-view title="Deck Detail">
  <ion-content scrolling="false">
    <a class="button button-light">Play</a>
    <a class="button button-light">Settings</a>
  </ion-content>
</ion-view>

The Category view is fine. When I get to the Deck view, nothing loads into the <ion-nav-view>, and there’s no error. The thing is, I was initially trying this in the Settings section (it also has child views), and it worked. Today I tried to apply the same code to the Decks, and it’s silently failing. I don’t get it.

Are my state declarations for the parent/child views wrong? Am I going about this entirely the wrong way, or is there something I’m missing?

Thanks!