Routing doesn't work for nested states


I’m having some difficulties getting the routing to work in a new project.

The projects needs the following routing:

  • dash
  • dash/{{id}}/view1
  • dash/{{id}}/view2

The issue is that the URL changes correctly but the view remains the same, unchanged.
Will appreciate the help.
Here’s the code.


<!DOCTYPE html>
    <meta charset="utf-8">
    <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">

    <link href="css/" rel="stylesheet">

    <!-- ionic/angularjs js -->
    <script src="lib/ionic/js/ionic.bundle.js"></script>

    <!-- cordova script (this will be a 404 during development) -->
    <script src="lib/ngCordova/dist/ng-cordova.js"></script>
    <script src="cordova.js"></script>

    <!-- your app's js -->
    <script src="js/app.js"></script>
    <script src="js/controllers.js"></script>
    <script src="js/services.js"></script>
  <body ng-app="app">

  <ion-nav-bar class="bar-positive">




angular.module('app', ['ionic', 'app.controllers', '', 'ngCordova'])

.run(function($ionicPlatform) {
  $ionicPlatform.ready(function() {
    // Hide the accessory bar by default (remove this to show the accessory bar above the keyboard
    // for form inputs)
    if(window.cordova && window.cordova.plugins.Keyboard) {
    if(window.StatusBar) {

.config(function($stateProvider, $urlRouterProvider) {

  // Ionic uses AngularUI Router which uses the concept of states
  // Learn more here:
  // Set up the various states which the app can be in.
  // Each state's controller can be found in controllers.js
  .state('dash, {
    url: '/dash',
    templateUrl: 'templates/dash.html',
    controller: 'DashCtrl'

  .state('', {
    abstract: true,
    url: '/:dashId'

  .state('', {
    url: '/view1',
    templateUrl: 'templates/dash-view-1.html',
    controller: 'DashInfoCtrl'

  .state('', {
    url: '/view2',
    templateUrl: 'templates/dash-view-2.html',
    controller: 'DashInfoCtrl'

  // if none of the above states are matched, use this as the fallback


<ion-view view-title="Dashboard">
            <ion-item ng-repeat="dash in dashboards" type="item-text-wrap" href="#/dash/{{}}/view1">
                Go to dashboard


<ion-view view-title="Dashboard View1">
        Dashboard View 1