如何在离子中使用 state.go？答案

【问题标题】：how to use state.go in ionic?如何在离子中使用 state.go？
【发布时间】：2016-11-24 08:45:54
【问题描述】：

我正在开发一个应用程序，登录后应该将用户从登录页面重定向到主页，我正在通过服务器上的 API 文件（此时是本地主机）使用http.post 进行登录方法，如果登录正确，服务器返回字符串“T”，然后在我的应用程序中，我控制字符串是否等于“T”，如果等于，应用程序应将用户重定向到主页。

我只有一个问题，那就是正确使用函数state.go();，因为我在控制台中看不到任何错误，但页面没有改变，但 url（我正在使用 ionic serve 进行测试） ) 完全改变。

这是我的代码：

APP.JS：

    angular.module('starter', ['ionic', 'ui.router'])

.run(function($ionicPlatform) {
  $ionicPlatform.ready(function() {
    if (window.cordova && window.cordova.plugins.Keyboard) {
      cordova.plugins.Keyboard.hideKeyboardAccessoryBar(true);
      cordova.plugins.Keyboard.disableScroll(true);

    }
    if (window.StatusBar) {
      StatusBar.styleDefault();
    }
  });
})


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

    .state('login', {
    url: '/',
    //abstract : true, // Because your are have child-states under de 'splash' state, you should set it abstract : true;
    templateUrl: '/login.html',
    controller: "LoginCtrl"
  })

    .state('main', {
        url: "main.html",
        templateUrl: "/main.html",
    })
}])


.controller('LoginCtrl', function($scope, $http, $state, $ionicHistory) {
    $scope.data = {};
    $scope.data.funzione = "login";
    $scope.submit = function(){
        //console.clear();
        console.log("Dentro funzione");
        console.log($scope.data.funzione);
        var link = 'http://localhost/<path>/api.php';
        $http.post(link, {mail : $scope.data.mail}, {pwd : $scope.data.pwd}, {funzione : $scope.data.funzione})
            .then(function (res){
                console.log("Dentro http.post");
                $scope.response = res.data;
                console.log($scope.response);
                if ($scope.response != "F"){
                    console.log("Dentro if");
                    $state.go('main');
                } else {
                    console.log("Dentro else");
                }
            });
    };
});

这是我的文件夹：(www)

这是 STATE.GO() 之后的 URL：

http://localhost:8100/login.html#/main.html

但应该是：

http://localhost:8100/main.html

【问题讨论】：

angular 会自动解析对 json 的响应。所以发送T 或F 没有任何意义。发送一些 json 对象，然后在客户端读取响应。你的控制台必须打印Dentro else。
是的，但使用“!= 'F'” 总是正确的（作为 state.go 的测试）@atulquest93
在主状态配置部分中注入maincontroller 的位置？
@RameshRajendran 不需要maincontroller，因为它不是处理登录的人
您是控制台打印Dentro if 吗？如果是，那么$state.go('main'); 必须工作。它是改变状态的标准方式。

标签： javascript angularjs ionic-framework state state.go

【解决方案1】：

Ionic 使用 ui-router。您可以正确使用： $state.go('main');

这仅在您检查的条件为真时才有效。 console.log() 语句打印什么？

********* 更新后备状态 **********

另外，定义一个后备状态：您错误地定义了url 和templateUrl。 url 应该是您在地址栏中看到的状态的地址，templateUrl 是应该在点击 url 时显示的 HTML 文件。

.config(['$stateProvider', '$urlRouterProvider', function($stateProvider, $urlRouterProvider) {
  $stateProvider
    .state('login', {
      url: '/login',
      //abstract : true, // Because your are have child-states under de 'splash' state, you should set it abstract : true;
      templateUrl: 'login.html',
      controller: "LoginCtrl"
    })
    .state('main', {
      url: "/main",
      templateUrl: "main.html",
    });

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

【讨论】：

为了简单而更新，现在避免任何花哨的东西

【解决方案2】：

这是 STATE.GO() 之后的 URL：

http://localhost:8100/login.html#/main.html

但应该是：

http://localhost:8100/main.html

答案：-

实际上从您的问题中了解到的是，您有一个单独的登录屏幕，一旦您登录完成，它将进入主屏幕。您在 login.html 页面中使用了ng-view 而不是 main.html 页面。所以现在你的 login.html 是一个母版页，这就是你得到那个 URL 结构的原因。

好吧，让我们开始吧。请查看流动的详细信息，

您是否在 login.html 中调用了所有脚本？
请检查哪一个是您的母版页？

【讨论】：

我的母版页是 index.html，它调用 (window.location) 登录页面