Ui-sref and changing state

I am trying to setup a list of categories in a sidemenu but am having problems with getting the links to actually work. It works fine when I open it in Chrome, however Safari and the iOS app the links appear to be dead. Here is the snippet of html:

<ion-side-menu class="CategoryMenu" side="right">
    <ion-content scroll-event-interval="20" scroll-effects scrollbar-y="true" has-bouncing="true">
        <ion-list>
            <ion-item ng-repeat="c in categories">
                <a ui-sref="category({ category: c })">{{c}}</a>
            </ion-item>
        </ion-list>
    </ion-content>
</ion-side-menu>

Here is how I register the state:

.config(function ($stateProvider, $urlRouterProvider) {
    $stateProvider.state('index', {
        templateUrl: 'home.html',
        url: '/'
    })
    .state('category', {
        url: '/category/:category',
        templateUrl: 'category.html',
        controller: 'CategoryCtrl'
    })

    $urlRouterProvider.otherwise("/");
})

I’ve been fussing with it over the last hour or so and at one point had it updating the url to be correct however the view never updated to the new state. A refresh of the url would get it to load the right view though.

Is there anything obvious that is wrong?

Hmm. I stepped back in time to when everything was working. In one view I am using ion-side-menus. Apparently having another ion-side-menus in a completely separate view breaks the ui-sref.

Any chance you could get an example of this in a codepen or plunker?