ionic $state.go not loading page or showing error

Question

I'm using $state.go() other places in my app but it's not working in a simple function and I can't work out why. It's not showing an error or showing the right state called in $state.go().

I've tested it with $stateChangeStart, $stateChangeError, $viewContentLoading & $stateChangeSuccess. It reaches all the correct stages: $stateChangeStart, $viewContentLoading then $stateChangeSuccess with the right content in each however, doesn't load the page.

I originally tried it with ui-sref and that didn't work so I tried it with $state.go() and now that isn't working I'm really confused. I can't see any difference between this code and what I have in other places where $state.go() works.

HTML link:

<li ng-repeat="thing in things" class="item" ng-click="showThingDetails()">

Code in controller:

$scope.showThingDetails = function () {
$state.go('thingDetails');}

Code in state:

.state('thingDetails', {
url: '/thingDetails',
views: {
  'menuContent': {
    templateUrl: 'templates/thingDetails.html',
    controller: 'thingDetails'
  }
}
})

thingDetails.html

<ion-view view-title="Thing Details">
  <ion-content>
    <h1>{{title}}</h1>
  </ion-content>
</ion-view>

thingDetails.js

angular.module('controllers')
  .controller('thingDetails', function($scope, $stateParams) {
    $scope.title = "thing";
});

Answer 1

I've just found the answer to my own problem. I had copied the state from another place in my app and defining the templateUrl and controller in the views object was causing it to play up. I took templateUrl and controller out of the views object and it worked.

Code in state is now as below and works:

.state('sweepstakeDetails', {
  url: '/sweepstakeDetails',
  templateUrl: 'templates/sweepstakeDetails.html',
  controller: 'sweepstakeDetails'
})

If anyone can add a more detailed answer as to why then I'd appreciate it.