Question

我遇到问题，如果我点击报告标签或其他标签。它将返回登录页面。我希望如果我点击另一个标签，它不会回到登录页面。有什么办法吗？这是我的插件

https://plnkr.co/edit/snDNgPEToZsIbXaHSWib?p=preview

这是我的js文件，谢谢你，对不起英文不好

var app = angular.module('coba', ['ngRoute']);

app.filter('coba', function() {
    return function(input, begin) {
        if (input) {
            begin = +begin;
            return input.slice(begin);
        }
        return [];
    }
});
app.filter('report', function() {
    return function(input, begin) {
        if (input) {
            begin = +begin;
            return input.slice(begin);
        }
        return [];
    }
});

app.config(['$routeProvider',
  function($routeProvider) { 
        $routeProvider.when('/', {
          templateUrl: 'login.html',
          controller: 'logincont'
        })
        .when('/main', {
          templateUrl: 'mainmenu2.html'
        })
        .otherwise({redirectTo: '/'});
}]);

app.run(function($rootScope,$route,$location){
       var unauthRoutes= [];
       console.log(unauthRoutes);
    angular.forEach($route.routes, function(route, path) {
        // push route onto unauthRoutes if it has a truthy allowUnauth value
        route.allowUnauth && (unauthRoutes.push(path));
    });

    $rootScope.$on('$routeChangeStart', function(event, nextLoc, currentLoc) 
    {
        var atuhRoute= (-1 === unauthRoutes.indexOf($location.path()));

        if(atuhRoute && !$rootScope.loggedIn) {
            $location.path('/');
        }
    });
})

app.controller("logincont", ['$scope','$http','$window','$location','$rootScope',function($scope,$http,$window,$location,$rootScope){
$scope.login = function () {
      if ($scope.userid == 'rock' && $scope.pass == 'rock')
        {
          alert('Login Incorrect'); 
        }
        else
        {
          $rootScope.loggedIn = true;
          $location.path('/main');
          console.log('success');
        }
      };  

      }]);

app.controller("moncont", ['$scope','$http','$filter','$window','$location',function($scope,$http,$filter,$window,$location){
  $scope.logout = function(){
    $location.path('/logout');
  }
      }]);

app.controller("repcont", ['$scope','$http',function($scope,$http){
  $scope.logout = function(){
    $location.path('/logout');
      };

      }]);

Answer 1

这是工作代码 - https://plnkr.co/edit/lYvMFO96IxpwfizjrUjy?p=preview

您应该在脚本中添加代码以处理路由到应用程序中的每个路由。例如，如果您想访问/report，您应该拥有以下内容 -

.when('/main', {
  templateUrl: 'mainmenu2.html'
})

同样，请将您的链接从href="#report"更新为href="#!report"

希望这有帮助。

Answer 2

您的链接指向不存在的网页，因此他们正在调用$routeProvider.otherwise({redirectTo: '/'});，由于when('/', { templateUrl: 'login.html', ...

，它会将您重定向回登录屏幕

您的链接还需要正确的哈希爆炸：

<li><a data-toggle="tab" href="#!/home">Log Out</a></li>

从#home更新为#!/home

现在他们可以指向正确的页面，只要存在，所以你需要修改你的配置：

app.config(['$routeProvider',
  function($routeProvider) { 
     $routeProvider.when('/', {
        templateUrl: 'login.html',
        controller: 'logincont'
     })
     .when('/main', {
        templateUrl: 'mainmenu2.html'
      })
     .when('/menu1', {
        templateUrl: 'menu1.html'
      })
     .when('/home', {
        templateUrl: 'home.html'
      })
     .when('/report', {
        templateUrl: 'report.html'
      })
      .otherwise({redirectTo: '/'});
}]);

Answer 3

首先，在你的代码中，在路径文件中，你没有提到你的pluker中提到的所有路径

main

有一条路线

.when('/main', {
          templateUrl: 'mainmenu2.html'
  })

将#main更改为#!main以使其有效。

<ul class="nav nav-tabs navbar-ke-kanan" >
    <li><a data-toggle="tab" href="#!login">Log Out</a></li>
    <li><a data-toggle="tab" href="#!main">Menu 2</a></li>
    <li><a data-toggle="tab" href="#!main">Report</a></li>
    <li class="active"><a data-toggle="tab" href="#!main">Monitoring</a></li>
  </ul>

Here is AN UPDATED PLUNKER

显示下一个标签bootstrap angular js

3 个答案: