Question

我的应用程序几小时前工作正常。现在，当我进入页面，触发事件时，应用程序返回主菜单。

我正在使用ngRoute：

app.js

angular.module('starter', ['ionic', 'ngRoute', 'starter.homeController', 'starter.clientsController', 'starter.jargonController', 'starter.toolsController', 'starter.welcomeController'])

.config(function($stateProvider, $urlRouterProvider) {
    $urlRouterProvider.otherwise('/home');

$stateProvider

    .state('home', {
        url: '/home',
        templateUrl: 'templates/home.html',
        controller: 'homeController'
    })
    .state('welcome', {
        url: '/welcome',
        templateUrl: 'templates/welcome.html',
        controller: 'welcomeController',
        css: 'css/welcome.css'
    })

    .state('jargon', {
        url: '/jargon',
        templateUrl: 'templates/jargon.html',
        controller: 'jargonController',
        css: 'css/jarg.css'


    })


    .state('tools', {
        url: '/tools',
        templateUrl: 'templates/tools.html',
        controller: 'toolsController',
        css: 'css/tools.css'
    })

            .state('clients', {
        url: '/clients',
        templateUrl: 'templates/clients.html',
        controller: 'clientsController',
        css: 'css/clients.css'

    });
});

的index.html

        <script src="lib/angular/angular.js"></script>
    <script src="lib/angular-route/angular-route.js"></script>
    <link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/angular_material/0.11.2/angular-material.min.css">
    <link href="lib/ionic/css/ionic.css" rel="stylesheet">
    <link href="css/style.css" rel="stylesheet">
    <script src="lib/ionic/js/ionic.bundle.js"></script>
    <script src="js/plugins/ionic.swipecards.js"></script>
    <script src="lib/ngCordova/dist/ng-cordova.js"></script>
    <script src="cordova.js"></script>
    <link href="https://code.jquery.com/jquery-1.10.2.js">
    <script src = "https://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js"> </script>
    <script src="js/app.js"></script>
    <script src="js/controllers/jargonController.js"></script>
    <script src="js/controllers/homeController.js"></script>
    <script src="js/controllers/toolsController.js"></script>
    <script src="js/controllers/welcomeController.js"></script>
    <script src="js/controllers/clientsController.js"></script>
    <link href="css/jarg.css" rel="stylesheet" />
    <link href="css/welcome.css" rel="stylesheet" />
    <link href="css/tools.css" rel="stylesheet" />
   <link href="css/home.css" rel="stylesheet"  />
   <link href="css/clients.css" rel="stylesheet"/>
<link href="//code.ionicframework.com/nightly/css/ionic.css" `rel="stylesheet">`
<script src="//code.ionicframework.com/nightly/js/ionic.bundle.js"></script>
<script src="http://code.ionicframework.com/collide/0.0.4/collide.js"></script>
<script src="http://www.loringdodge.com/files/ionic.tdcards2.js"></script>
<script src="lib/angular-touch/angular-touch.js"></script>
<script src="lib/angular-animate/angular-animate.js"></script>

Welcome.html

<ion-header-bar class="bar bar-header bar-calm">
    <h1 class="tit">Bienvenue!</h1>
      <fab-button class="button icon ion-home pull-right" id="button" ui-sref="home"></fab-button>
</ion-header-bar>
<div class="item" href="#/welcome"></div>
<ion-content ng-controller="welcomeController" style="margin-top: 25px">
        <div class="contenu1">
          <p>Salut, Welcome, Bienvenue chez <div class="jargon-item"><a href="#" ng-model="collapsed1" ng-click="collapsed1=!collapsed1">R2A</a></p>
          <div ><font class="boxed" ng-show="collapsed1">Rhone-Alpes Auvergne</font></div></div>
      <p>Nous sommes ton equipe de Welcomers, nous allons t'accompagner pour ta première journée.</p>
        </div>
    </ion-scroll>
</ion-content>
<ion-footer-bar class="bar">
  <img src="img/Imag.png" class="test2" />
  <img src="img/Test3.png" class="test"/>
</ion-footer>

WelcomeController：

angular.module('starter.welcomeController', ['ionic'])
.controller('welcomeController', function ($scope) {
});

问题是，当我点击R2A时，collapsed会显示，但页面会返回/ home。有人可以帮帮我吗？

Answer 1

<a href="#" ng-model="collapsed1" ng-click="collapsed1=!collapsed1">R2A</a>

锚标记包含href为'＃'，由角路由器拦截。您可以将href更改为javascript：void（0）或使用按钮代替锚点来切换视图内容。

ngRoute在页面之间随机切换

1 个答案: