5

recentemente inicie no Ionic, e creio que como dúvida de iniciante, estou tendo dúvida referentes sobre abrir paginas, ou seja, navegar entre as minhas views no caso são 3 seriam elas, a home, pag1, pag2, somente a fins de teste deveria aparecer uma mensagem aleatória. Se caso as rotas estiverem corretas, seria necessário carregar algum modulo? Cordialmente,

index.html

       <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">
    -->

<!-- instruções rotas ng-->

<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.1.5/angular.min.js"></script>
   <script src="js/angular-ui-router.js"></script>
<script src="js/angular.js"></script>
    <script>
    var App = angular.module('starter', ['ui-route']);
        // For Component users, it should look like this:
        // var myApp = angular.module('myApp', [require('angular-ui-router')]);
    </script>
    <!-- ionic biblioteca js -->



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

<-- nossos arquivos js -->
    <script src="cordova.js""></script>
	 <script src="js/app.js"></script>
<script src="controladores/HomeCtrl.js"></script>
	<script src="controladores/Pag1Ctrl.js"></script>
	<script src="controladores/Pag2Ctrl.js"></script>

  <!-- rotas -->

  <script src="js/rotas.js"></script>


</head>
  <body ng-app="starter">
    <ion-nav-bar>
      <ion-nav-back-button>
                </ion-nav-back-button>
                    </ion-nav-bar>

                    <ion-nav-view></ion-nav-view> -->



<div>
<a ng-href="home">home </a>
<a ng-href="pag1">pagina1 </a>
<a ng-href="pag2">pagina2</a>


                  </body>
                  </html>

rotas.js

 var App = angular.module('starter').config(function($stateProvider, $urlRouterProvider) {
  $urlRouterProvider.otherwise('/home');


  $stateProvider

    .state('home', {
      url: '/home',
      templateUrl: 'views/home.html',
      controller: 'HomeCtrl'
    })

    .state('pag1', {
      url: '/pag1',
      templateUrl: 'views/pag1.html',
      controller: 'Pag1Ctrl'
    })

    .state('pag2', {
      url: '/pag2',
      templateUrl: 'views/pag2.html',
      controller: 'Pag2Ctrl'
    })

  });

app.js

angular.module('starter', ['ui-route']);
.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();
    }
  });
})

home

1
  • Cade os seus controllers? Você abriu uma <div> e não fechou. 15/04/2016 às 17:55

1 Resposta 1

2

Se você está usando o ui-router, onde quer que você esteja, injete $state e utilize a função .go()

Exemplo:

angular.module('App', [ 'ionic',...])

.run(function($state) {

     if ( ... ) {
            $state.go('pag1');
     else {
            $state.go('pag2');
     }

});

Outro Exemplo:

angular.module('App')
    .controller('MeuController', function ($state) {
           $state.go('app.contato');
});

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .