angularjs – 无法解析’…’从状态”

这是我第一次尝试使用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>

但我得到了

Could not resolve ‘register’ from state ”

例外。这里有什么问题？

这种错误通常意味着，(js)代码的某些部分没有加载。那个在ui-sref里面的状态丢失了。

有a working example

我不是离子的专家，所以这个例子应该显示它会工作，但我使用了一些技巧(父选项卡)

这是一个有点调整的状态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",});

  $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>

接下来的例子，如何使它运行，以后使用离子框架正确的方法…检查例子here

这里是类似的Q& A有一个使用命名视图(为更好的解决方案)的示例ionic routing issue,shows blank page

在选项卡中使用命名视图改进的版本为：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',views: { "index" : { templateUrl: "tpl.index.html" } },views: { "register" : { templateUrl: "tpl.register.html",} },});