Question

我的下方app.js：

var app = angular.module('dbpjkApps', ['ionic'])

app.controller('kategoriCtrl', function($scope) {
    $scope.listKat = [
        {kat: 'math'}, {kat: 'physics'}, {kat: 'English'}, {kat: 'bahasa'},
    ]})
    .config(function($stateProvider, $urlRouterProvider) {
        $stateProvider

        .state('menu1', {
            url: '/menu1',
            templateUrl: 'xxx.html' //this is condition what i mean. 
        })

        .state('login1', {
            url: '/login1',
            templateUrl: 'login1.html'
         });

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

在第一步，用户从select/combobox上的login1.html选择类别。

如何在用户选择数学或物理时写入条件，然后相应地打开页面menu1.html或menu2.html？如何从login1.html或menu1.html上的menu2.html获取用户选择的价值？

谢谢你：）

Answer 1

您可以在组合框上使用ng-model，它将为您提供选定的值

并在stateProvider中定义状态

.state('menu1', {
            url: '/menu1',
            templateUrl: 'menu1.html' //this is condition what i mean. 
        })


.state('menu2', {
            url: '/menu2',
            templateUrl: 'menu2.html' //this is condition what i mean. 
        })

之后只需在登录控制器中检查组合框的ng-model值，然后再添加以下行重定向页面

if(condition1){
       $state.go('menu1'); 
}else if(condition2){
       $state.go('menu2'); 
}

Answer 2

首先准备你的配置

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

        .state('menu1', {
            url: '/menu1/:userChoice',
            templateUrl: 'xxx.html' //this is condition what i mean. 
        })

        .state('menu1', {
            url: '/menu2/:userChoice', //This is how to create params for the state
            templateUrl: 'xxx2.html' //this is an other state. 
        })

        .state('login1', {
            url: '/login1',
            templateUrl: 'login1.html'
         });

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

要查看控制器的位置，您可以：

    app.controller('kategoriCtrl', function ($scope, $state) {
    $scope.listKat = [
        {
            kat: 'math'
        }, {
            kat: 'physics'
        }, {
            kat: 'English'
        }, {
            kat: 'bahasa'
        },
    ]

    //Having defined the ng-model in the select tag in your html tempalte.

    $scope.choice = $scope.listKat[0];

    $scope.changeState = function () {
        if ($scope.choice == "math") {
            $state.go("menu1", {
                userChoice: $scope.choice
            });
        } else if ($scope.choice == "physics") {
            $state.go("menu2", {
                userChoice: $scope.choice
            });
        }

    }
})

然后在你的math1Ctrl中取下参数：

app.controller('math1Ctrl', function($stateParams) {
    console.log($stateParams.userChoice); // math or physics
})

如何将值发送到Ionic中具有条件的其他页面

2 个答案: