使用angular在ionic中從登錄頁面移至主頁

Question

我的代碼工作正常。 但是當我單擊登錄按鈕時，它會更改狀態，如圖所示，它正在更改其url但沒有打開該頁面。任何幫助我如何重定向到下一頁？

的index.html

<body ng-app="starter">
    <ion-nav-view></ion-nav-view>
  </body>

的login.html

<ion-view view-title="login">
  <ion-header-bar>
    <h1 class="title">Login</h1>
    <div class="buttons">
      <button class="button button-clear" ng-click="closeLogin()">Close</button>
    </div>
  </ion-header-bar>
  <ion-content>
    <form ng-submit="doLogin()">
      <div class="list">
        <label class="item item-input">
          <span class="input-label">Username</span>
          <input type="text" ng-model="loginData.username">
        </label>
        <label class="item item-input">
          <span class="input-label">Password</span>
          <input type="password" ng-model="loginData.password">
        </label>
        <label class="item">
          <button class="button button-block button-positive" type="submit">Log in</button>
        </label>
      </div>
    </form>
  </ion-content>
</ion-view>

app.js

angular.module('starter', ['ionic', 'starter.controllers'])
.config(function($stateProvider, $urlRouterProvider) {
  $stateProvider

    .state('app', {
    url: '/app',
    templateUrl: 'templates/login.html',
    controller: 'AppCtrl'
  })

   .state('app.menu', {
    url: '/home',
    abstract: true,
    templateUrl: 'templates/menu.html',
    controller: 'AppCtrl'
  })
  .state('app.search', {
     url: '/search',
     views: {
    '   menuContent': {
           templateUrl: 'templates/search.html'
        }
     }
  })
});

Controllers.js

angular.module('starter.controllers', [])

.controller('AppCtrl', function($scope, $ionicModal, $timeout, $state) {

  // With the new view caching in Ionic, Controllers are only called
  // when they are recreated or on app start, instead of every page change.
  // To listen for when this page is active (for example, to refresh data),
  // listen for the $ionicView.enter event:
  //$scope.$on('$ionicView.enter', function(e) {
  //});

  // Form data for the login modal
  $scope.loginData = {};

  // Create the login modal that we will use later
  $ionicModal.fromTemplateUrl('templates/login.html', {
    scope: $scope
  }).then(function(modal) {
    $scope.modal = modal;
  });

  // Triggered in the login modal to close it
  $scope.closeLogin = function() {
    $scope.modal.hide();
  };

  // Open the login modal
  $scope.login = function() {
    $scope.modal.show();
  };

  // Perform the login action when the user submits the login form
  $scope.doLogin = function() {
    console.log('Doing login', $scope.loginData);
    $state.go('app.search');

    // Simulate a login delay. Remove this and replace with your login
    // code if using a login system
    $timeout(function() {
      $scope.closeLogin();
    }, 1000);
  };
})

Answer 1

您將搜索狀態設置為應用程序狀態的子狀態（顯示您的登錄名）。

因此，它將首先顯示帶有登錄名的模板，並且該模板不包含任何有助於顯示其他狀態的內容。

我認為您希望自己的狀態為：使用url / log和url / app和abstract登錄應用程序，然后使用url / search進行app.search。

然后在您的網址欄中，您將看到/ app / search，它將是您要查找的正確的URL和正確的狀態。

使用angular在ionic中從登錄頁面移至主頁

問題描述

1 個解決方案

解決方案1
0 已采納 2017-03-10 12:09:49

使用angular在ionic中從登錄頁面移至主頁

問題描述

1 個解決方案

解決方案1 0 已采納 2017-03-10 12:09:49

解決方案1
0 已采納 2017-03-10 12:09:49