2016-01-08 3 views
1

Я разрабатываю приложение для Android в ионной структуре. может ли кто-нибудь направить меня, как я могу перенаправить с одной страницы на другую страницу.Ionic Framework Перейдите с одной страницы на другую.

Вот мой код

index.html

<!DOCTYPE html> 
<html> 
<head> 
    <meta charset="utf-8"> 
    <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width"> 
    <title></title> 

    <link href="lib/ionic/css/ionic.css" rel="stylesheet"> 
    <link href="css/style.css" rel="stylesheet"> 

    <!-- IF using Sass (run gulp sass first), then uncomment below and remove the CSS includes above 
    <link href="css/ionic.app.css" rel="stylesheet"> 
--> 

<!-- ionic/angularjs js --> 
<script src="lib/ionic/js/ionic.bundle.js"></script> 

<!-- cordova script (this will be a 404 during development) --> 
<script src="cordova.js"></script> 

<!-- your app's js --> 
<script src="js/app.js"></script> 
<script src="js/controller.js"></script> 

</head> 
<body ng-app="starter"> 

    <ion-pane> 

    <div class="item" align="center"> 
     Current Seminars 
    </div> 

    <ion-content scroll="true" overflow-scroll="true" class="iframe-wrapper"> 
    <iframe class= 'webPage' data-tap-disabled="true" name= "eventsPage" src="http://www.google.com"> 
    </iframe> 

</ion-content> 

<div class="bar bar-footer bar-positive"> 
    <div class="title" align="center" >Next</div> 

</div> 
</ion-pane> 

</body> 
</html> 

app.js

// Ionic Starter App 

// angular.module is a global place for creating, registering and retrieving Angular modules 
// 'starter' is the name of this angular module example (also set in a <body> attribute in index.html) 
// the 2nd parameter is an array of 'requires' 
var app=angular.module('starter', ['ionic']) 

.run(function($ionicPlatform) { 
    $ionicPlatform.ready(function() { 
    if(window.cordova && window.cordova.plugins.Keyboard) { 
     // Hide the accessory bar by default (remove this to show the accessory bar above the keyboard 
     // for form inputs) 
    cordova.plugins.Keyboard.hideKeyboardAccessoryBar(true); 

     // Don't remove this line unless you know what you are doing. It stops the viewport 
     // from snapping when text inputs are focused. Ionic handles this internally for 
     // a much nicer keyboard experience. 
     cordova.plugins.Keyboard.disableScroll(true); 
    } 
    if(window.StatusBar) { 
     StatusBar.styleDefault(); 
    } 
    }); 
}); 

Когда пользователь нажимает на "Next", то я хочу, чтобы перенаправить его/ее на следующей странице .Заранее спасибо.

ответ

1

Вы можете перенаправить одну страницу на другую страницу:

приложение/index.html

<html ng-app="starter"> 
<head> 
    <meta charset="utf-8"> 
    <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width"> 
    <link href="http://code.ionicframework.com/nightly/css/ionic.css" rel="stylesheet"> 
    <script src="http://code.ionicframework.com/nightly/js/ionic.bundle.js"></script> 
<script> 
    angular.module('starter', ['ionic']) 
    .config(function($stateProvider, $urlRouterProvider) { 
     $stateProvider 
     .state('home', { 
       url: "/home", 
       templateUrl: "templates/home.html", 
       controller: "HomeCtrl" 
     }) 
     .state('detail', { 
       url: "/detail", 
       templateUrl: "templates/detail.html", 
       controller: "DetailCtrl" 
     })  
     $urlRouterProvider.otherwise("/home"); 
    }) 
    .controller('HomeCtrl', function($scope) { 
    }) 
    .controller('DetailCtrl', function($scope) { 
    }) 
</script> 
</head> 
<body> 
    <ion-nav-bar></ion-nav-bar> 
    <ion-nav-view></ion-nav-view> 
</body> 
</html> 

приложение/шаблоны/home.html

<ion-view view-title="Home"> 
    <ion-content class="padding"> 
     <a ui-sref="detail">Next Page</a>   
    </ion-content> 
</ion-view> 

приложение/шаблоны/detail.html

<ion-view view-title="Detail"> 
    <ion-content class="padding"> 
     <p>Detail</p>   
    </ion-content> 
</ion-view> 
+0

спасибо вед .. :) –

+0

самый долгожданный .....! – Ved

+0

привет, мне нужна помощь. –

Смежные вопросы