导航到 Ionic-V1 中的新页面答案

【问题标题】：Navigate to new page in Ionic-V1导航到 Ionic-V1 中的新页面
【发布时间】：2017-11-23 01:09:22
【问题描述】：

我目前正在使用 Ionic v1 开发一个项目。我在项目中有多个用户类型，其中每个用户类型都必须根据他们的时间重定向到不同的页面。我无法做到这一点。这是我的代码：

app.js：

.state('tab.login', {
url: '/login',
views: {
  'tab-login': {
    templateUrl: 'templates/tab-login.html',
    controller: 'LoginCtrl'
  }
 }
})
.state('guest.home' , {
  url: '/guesthome',
  views: {
    'guest-home': {
      templateUrl: 'templates/guest-home.html',
      controller: 'GuestCtrl'
    }
  }
})

.state('agent.home' , {
  url: '/agenthome',
  views: {
    'agent-home': {
      templateUrl: 'templates/agent-home.html',
      controller: 'AgentCtrl'
    }
  }
})

controller.js：

.controller('LoginCtrl', function($scope, $state) {
  $scope.userLogin = function(email, password) {
  Backendless.UserService.login( $scope.email, $scope.password, true )
  .then( $scope.userLoggedIn )
  .catch ( $scope.gotError )
}

$scope.userLoggedIn = function( user ) {
console.log("User has logged in");
if ( user.user_type === "g" )
  $state.go('guest.home');
else
  $state.go('agent.home');
}

$scope.gotError = function( err ) {
console.log( "error message - " + err.message );
    console.log( "error code - " + err.statusCode );
}

})

标签登录.html：

<ion-content class="padding" ng-controller="LoginCtrl">
<div class="list">
  <label class="item item-input item-floating-label">
    <span class="input-label">Email</span>
    <input type="text" placeholder="Email" ng-model="email">
  </label>
  <label class="item item-input item-floating-label">
    <span class="input-label">Password</span>
    <input type="password" placeholder="Password" ng-model="password">
  </label>
</div>
<div class="text-center">
  <button class="button button-positive" ng-click="userLogin()">
    Login
  </button>
</div>
</ion-content>

我收到错误 error message - Could not resolve 'guest.home' from state 'tab.login' 我做错了什么？

【问题讨论】：

标签： javascript angularjs ionic-framework

【解决方案1】：

我认为问题可能与您在州名上使用点而没有定义抽象状态来容纳孩子这一事实有关。

试一试不带点（可能是“guesthome”？），或者将您的路由更改为具有抽象状态。

这是一个例子：

        $stateProvider
        .state('setup', {
            url: '/setup',
            abstract: true,
            templateUrl: 'js/views/setupView.html',
            controller: 'SetupController'
        })
        .state('setup.bluetooth', {
            url: '/bluetooth',
            views: {
                'setupContent': {
                    templateUrl: 'js/views/bluetoothSetupView.html',
                    controller: 'BluetoothSetupController'
                }
            }
        })
        .state('setup.truck', {
            url: '/truck',
            views: {
                'setupContent': {
                    templateUrl: 'js/views/truckSetupView.html',
                    controller: 'TruckSetupController'
                }
            }
        })

【讨论】：