Не удалось разрешить "…" из состояния ""

Я впервые пытаюсь использовать ui-router.

Вот мой app.js

angular.module('myApp', ['ionic'])

.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) {
      cordova.plugins.Keyboard.hideKeyboardAccessoryBar(true);
    }
    if(window.StatusBar) {
      StatusBar.styleDefault();
    }
  });
})

.config(function($stateProvider, $urlRouterProvider){
  $urlRouterProvider.otherwise("/index.html");

  $stateProvider.state('index', {
    url: '/'
    template: "index.html",
    controller: 'loginCtrl'
  });


  $stateProvider.state('register', {
    url: "/register"
    template: "register.html",
    controller: 'registerCtrl'
  });
})

Как видите, у меня два состояния. Я пытаюсь зарегистрировать такое состояние:

<a ui-sref="register">
  <button class="button button-balanced">
    Create an account
  </button>
</a>

Но я получаю

Не удалось разрешить "регистр" из состояния ""

исключение. В чем проблема?

Этот вид ошибки обычно означает, что некоторые части (JS) кода не были загружены. То состояние, которое находится внутри, ui-srefотсутствует.

Есть рабочий пример

Я не эксперт в ионных технологиях, поэтому этот пример должен показать, что он будет работать, но я использовал еще несколько приемов (родительский элемент для вкладок)

Это немного измененное состояние def:

.config(function($stateProvider, $urlRouterProvider){
  $urlRouterProvider.otherwise("/index.html");

    $stateProvider

    .state('app', {
      abstract: true,
      templateUrl: "tpl.menu.html",
    })

  $stateProvider.state('index', {
    url: '/',
    templateUrl: "tpl.index.html",
    parent: "app",
  });


  $stateProvider.state('register', {
    url: "/register",
    templateUrl: "tpl.register.html",
    parent: "app",
  });

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

И вот у нас есть родительский вид с вкладками и их содержимым:

<ion-tabs class="tabs-icon-top">

  <ion-tab title="Index" icon="icon ion-home" ui-sref="index">
    <ion-nav-view name=""></ion-nav-view>
  </ion-tab>

  <ion-tab title="Register" icon="icon ion-person" ui-sref="register">
    <ion-nav-view name=""></ion-nav-view>
  </ion-tab>

</ion-tabs>

Возьмите это больше, чем пример того, как заставить его работать, а затем правильно использовать ионную структуру ... Посмотрите этот пример здесь

Вот аналогичные вопросы и ответы с примером использования именованных представлений (наверняка лучшее решение) проблема ионной маршрутизации, показывает пустую страницу

Улучшенная версия с именованными представлениями на вкладке находится здесь: http://plnkr.co/edit/Mj0rUxjLOXhHIelt249K?p=preview

  <ion-tab title="Index" icon="icon ion-home" ui-sref="index">
    <ion-nav-view name="index"></ion-nav-view>
  </ion-tab>

  <ion-tab title="Register" icon="icon ion-person" ui-sref="register">
    <ion-nav-view name="register"></ion-nav-view>
  </ion-tab>

таргетинг на именованные представления:

  $stateProvider.state('index', {
    url: '/',
    views: { "index" : { templateUrl: "tpl.index.html" } },
    parent: "app",
  });


  $stateProvider.state('register', {
    url: "/register",
    views: { "register" : { templateUrl: "tpl.register.html", } },
    parent: "app",
  });

Просто пришла сюда, чтобы поделиться тем, что со мной происходит.
Вам не нужно указывать родителя, состояния работают документально, поэтому вместо указания parent: app вы можете просто изменить состояние на app.index

.config(function($stateProvider, $urlRouterProvider){
    $urlRouterProvider.otherwise("/index.html");

$stateProvider.state('app', {
  abstract: true,
  templateUrl: "tpl.menu.html"
});

$stateProvider.state('app.index', {
    url: '/',
    templateUrl: "tpl.index.html"
});

$stateProvider.state('app.register', {
    url: "/register",
    templateUrl: "tpl.register.html"
});

ИЗМЕНИТЬ Предупреждение, если вы хотите углубиться во вложение, я должен указать полный путь. Например, у вас не может быть такого состояния, как

app.cruds.posts.create

не имея

app
app.cruds
app.cruds.posts

или angular выдаст исключение, в котором говорится, что он не может определить маршрут. Чтобы решить эту проблему, вы можете определить абстрактные состояния

.state('app', {
     url: "/app",
     abstract: true
})
.state('app.cruds', {
     url: "/app/cruds",
     abstract: true
})
.state('app/cruds/posts', {
     url: "/app/cruds/posts",
     abstract: true
})

У меня была такая же проблема с Ionic.

Оказалось, что с моим кодом все было в порядке, мне просто пришлось выйти из сеанса ионной подачи и снова запустить ионную службу.

После возврата в приложение мои состояния работали нормально.

Я также предлагаю несколько раз нажать save в файле app.js, если вы используете gulp, чтобы убедиться, что все будет повторно скомпилировано.

Была такая же проблема с ионной маршрутизацией.

Простое решение - использовать название штата - в основном state.go(state name)

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

И в контроллере вы можете использовать $state.go('tab.search');

У меня был случай, когда ошибка была вызвана

$state.go('');

Что очевидно. Думаю, это может кому-то помочь в будущем.

Как ответил Маг:

я должен указать полный путь

Абстрактные состояния можно использовать для добавления префикса ко всем URL-адресам дочерних состояний. Но обратите внимание, что abstract по-прежнему нуждается в пользовательском интерфейсе для заполнения его дочерними элементами . Для этого вы можете просто добавить его в строку.

.state('app', {
   url: "/app",
   abstract: true,
   template: '<ui-view/>'
})

Для получения дополнительной информации см. Документацию: https://github.com/angular-ui/ui-router/wiki/Nested-States-%26-Nested-Views