【问题标题】:Routing not working when i click second time当我第二次单击时路由不起作用
【发布时间】:2017-11-23 06:51:54
【问题描述】:

大家好,我正在使用 angularjs 并使用路由功能(路由提供程序),只有当我单击第二个菜单时它才第一次工作,它没有重定向,而且我在控制台帮助中也没有收到任何错误,如何在此处解决我附上我的代码

代码

 <!DOCTYPE html>
    <html  ng-app="app" >
    <head>
    <script src="assets/js/AngularJS1.3.12.min.js"></script>
   <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.2.25/angular-route.js"></script>
     <script src="controller/module.js"></script>
    </head>
    <body class="no-skin" >
      <a href="#/managerole">role</a> 
        or 
     <a href="#/manageuser">user</a>
     <div ng-view></div>
    </body>
    </html>

module.js

var app = angular.module("app", [  "ngRoute"]);
// configure our routes
app.config(['$routeProvider','$locationProvider','$httpProvider',function ($routeProvider,$locationProvider,  $httpProvider) {
    $locationProvider.hashPrefix('');
        // route for the about page
        $routeProvider
        .when('/', {
            templateUrl: 'UnderConstruction.html'

        })
        .when('/managerole', {
            templateUrl: 'role.html',
            controller: 'RoleViewCtrlq'
        })
        .when('/manageuser', {
            templateUrl: 'user.html',
            controller: 'UserController' 
        });


}]);

    app.controller('RoleViewCtrlq', function($scope) {
        $scope.message = 'Look! I am an Role  page.';
    });

    app.controller('UserController', function($scope) {
        $scope.message ='Look! I am an user  page.';
    });

【问题讨论】:

  • 试试这个:用户
  • @Ved 相同的第一次点击有效第二次点击无效
  • 第一次点击有效,第二次无效是什么意思。删除 / 并检查。它应该可以工作。

标签: javascript angularjs angularjs-routing


【解决方案1】:

根据您的代码,您忘记在 Html 页面中添加 ng-view 标签

下面是帮助你的示例

https://www.w3schools.com/angular/tryit.asp?filename=try_ng_routing_controller

【讨论】:

    【解决方案2】:

    请试试这个:

    <body class="no-skin" >
          <a href="#!managerole">role</a> 
            or 
         <a href="#!manageuser">user</a>
         <div ng-view></div>
     </body>
    

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 2012-07-09
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2015-11-25
      • 2017-08-19
      相关资源
      最近更新 更多